vue随笔（有关插槽）

我们只要在需要的地方加入插槽，通过插槽分发内容

具名插槽

父组通过slot定义一个名称， 子组件通过name获取名称 传入父组件的内容，在子组件中相应位置（slot处）会被替换成为父组件的内容

例如 ：
父组件

<soll>
      <h1 slot="s-title">具名插槽</h1>
 </soll>

子组件：

<template>
  <div class="wape">
    <div>
      <p>子组件</p>
      <slot name="s-title"></slot>
    </div>
  </div>
</template>

作用域插槽

父组件一个区域内（template处）从子组件接收的数据放在一个自定义属性内，然后通过这一区域（template处）内的dom渲染出来，可以绑定数据的插槽，显示内容完全由子组件决定，数据来自子组件。

例如：
父组件:

 <soll2 :number="number">
      <template slot-scope="props">
        <li>{{ props.value }}</li>
        <H3>{{ props.value }}</H3>
      </template>
  </soll2>

子组件：

<template>
  <div class="wape">
    <div>
      <p>子组件作用域插槽</p>
      <ul>
        <slot v-for="item in 6" :value="item"></slot>
      </ul>
    </div>
  </div>
</template>