一、一般定义子组件情况：
<body>
<div id="app">
<child>
<span>123456</span>
</child>
</div>
<script>
new Vue({
el:'#app',
components:{
child:{
template:"<div>我是子组件</div>"
}
}
});
</script>
</body>
二、单个slot
在template中添加<slot></slot>标签
<script>
new Vue({
el:'#app',
components:{
child:{
template:"<div><slot></slot>我是子组件</div>"
}
}
});
</script>
浏览器打开：<span>123456</span>内容不会显示，界面只显示：我是子组件
注：虽然<span>标签被子组件的child标签所包含，但由于他不在子组件的template属性中，因此不属于子组件
总结：slot分发其实就是父组件需要在子组件内放一些DOM，它就是负责这些DOM是否显示，在哪个地方显示的。
扫一扫
1074
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
