vue中,一般组件定义好之后在使用的时候往两个标签之间插入内容是无效的,如下图,子组件中的hi vue内容并不会出现。
但是在定义的时候加入slot标签后,使用时插入的内容就会被添加到slot所处的位置。
组件定义
let componentA = {
template: `<a>
<slot></slot>
</a>`
};
let app = new Vue({
el: '#app',
//局部注册组件
components: {
'component-a': componentA,
}
})
组件的使用
<div id="app">
<component-a>