vue的插槽slot

插槽 是父组件 分发给子组件的内容 切记 切记
父组件
安装脚手架 有一个eslint的插件 建议学习的时候不适合的建议别安装
要命 可能是一个完美主义者空格也扣的厉害
就基本除外额外安装一个单元测试得了（弱弱的说）

<template>
  <div id="app">
    <ss>
      <div>默认插槽</div>
      <div slot="app">hello</div>
      <div slot="data" slot-scope="user">//插槽作用域起了一个别名
      //类似于export default 封装方法与属性 
          <span v-for="a in user.data" :key="">{{a.name}}</span>
      </div>
    </ss>
  </div>
</template>

子组件
默认插槽当父组件是除了具名插槽什么都没有才显示

<template>
<div>
    <slot>123q</slot>//默认插槽没有name
    <slot name="app">hello</slot>//具名插槽对应父组件slot="app"这个属性
    <slot name="data" :data="data"></slot>//具名插槽作用域
    //子组件使用slot绑定data数据，使用别名
    //在父组件调用子组件里面使用slot-scope插槽作用域来获取子组件数据
</div>
</template>
<script>
export default {
    data(){
        return {
            msg:"",
            data:[{id:1,name:"user"},{id:2,name:"pass"}]
        }
    }
}
</script>