Vue-slot使用方法

单个 Slot
在子组件内使用特殊的<slot>元素就可以为这个子组件添加一个 slot (插槽),在父组件模板里,插入在子组件标签内的所有内容将替代子组件的<slot>标签及它的内容.示例代码如下:

组件a

<div id="app">
     <div>
        <p>分发的内容</p>
        <p>更多分发的内容</p>
    </div>
<slot name="b"></slot>
</div>

组件b

<div id="app">
<a>
  <div slot="b">我是插槽的内</div>
//slot="b" 是对应组件a插槽所限制的内容
</a>
</div>