插槽的基本使用和作用域插槽

1.编译作用域

父级模板里的所有内容都是在父级作用域中编译的；子模板里的所有内容都是在子作用域中编译的。

即父子组件只能使用各自作用域的数据

2.插槽的后备内容（slot中默认配置内容）

可以在slot中提前设置一段内容作为默认值，当父组件提供插槽内容时将会被覆盖

    

      这是子组件插槽的默认内容
    

以下会被覆盖

3.vm.$slots  API 的形式获取子组件插槽内容

vm.$slots用来访问被插槽分发的内容。（在父组件中获取子组件的虚拟DOM）

插槽没有命名时：v-slot:default获取所有子组件插槽的实例。如：this.$refs.child.$slots()

插槽有名字时：v-slot:name

  

  
Here's some page content, which will be included in vm.$slots.default, because it's not inside a named slot.

  

  
If I have some content down here, it will also be included in vm.$slots.default.
.

4.作用域插槽

作用域插槽能够实现在父组件中获取子组件的数据

当前插槽绑定数据

父组件中通过{{user}}进行获取和使用

  v-slot:default默认插槽

  v-slot:header具名插槽

实际应用场景：

elementUI表格按钮中获取父组件中的数据，再传入按钮中

  
    {{ user.lastName }}