Vue中插槽的理解

插槽内容

插槽，也就是slot，在Vue中的作用相当于一个模板，通过父组件里的这个模板，就能决定子组件里使用这个模板的时候，显不显示，显示什么，怎么显示。

首先来个简单的例子：

合成组件：

<child>
  <p>yang</p>
</child>

child 里的模板：

<div>
  <P>Hello</P>
  <slot></slot>
</div>

显示的效果：

在上面这个例子里，子组件里的插槽被父组件使用了，所以父组件里的效果就相当于：

<div>
  <P>Hello</P>
  <p>yang</p>