在组件的使用中,比如需要在table中将tr定义为一个组件时,如下:

<div id="root">
	<table>
		<tbody>
			<row></row>	
			<row></row>	
		</tbody>
	</table>
</div>

<script>
	Vue.component("row", {
		template: "<tr><td>这是一个tr组件</td></tr>"
	});

	var vm = new Vue({
		el: "#root"
	});
</script>

实际视图结果如下:
在这里插入图片描述
正常情况下,三个应该在中,但是这里,标签被浏览器解析到

标签上边了。
可以通过以下方式解决:

<div id="root">
	<table>
		<tbody>
			<tr is="row"></tr>	
		</tbody>
	</table>
</div>

<script>
	Vue.component("row", {
		template: "<tr><td>这是一个tr组件</td></tr>"
	});

	var vm = new Vue({
		el: "#root"
	});
</script>

同理,在其组件中遇到其他标签例如:

    • 中的
    • 中的
    Logo

    前往低代码交流专区

    更多推荐