vue slot 默认插槽，具名插槽，作用域插槽三种相关用法

插槽含义：就是引入子组件后，在插入子组件元素中添加信息或者标签，使得子组件的指定位置插入信息或者标签

用法一：默认插槽用法

插槽显不显示、怎样显示是由父组件来控制的，而插槽在哪里显示就由子组件来进行控制，默认插槽可以通过父组件的标签进行传递标签的内容，甚至组件都看可以。

父组件

子组件

视图展示内容

image.png

这里我们可以看到，子组件插槽标签展示的内容是父组件通过组件标签传递过来的。也就是说插槽的内容是由父组件决定（补充：当父组件没有传递参数时，默认是子组件的内容）

用法二：具名插槽

具名插槽可以自定义组件通过插槽的方式插入多处。
子组件通过slot标签定义name属性，然后父组件通过slot属性对应子组件的slot标签的name，这样就能在组件相应的位置插入需要的信息了

父组件

子组件

视图展示内容

image.png

用法三：作用域插槽

由于Vue官方在2.6版本以后改变了插槽的书写方式，这次这里还是2.6以前的版本的使用，2.6以后的版本也兼容

父组件

子组件

视图展示内容

image.png

从上面三种情况可以看出，前两种插槽（默认插槽和具名插槽）的内容和样式皆由父组件决定，也就是说显示什么内容和怎样显示都由父组件决定；而作用域插槽就不同了，作用域插槽的样式由父组件决定，内容却由子组件控制。简单来说：前两种插槽不能绑定数据，作用域插槽是一个带绑定数据的插槽。

好了，以上是我对插槽用法的整理，如果有什么问题欢迎指出。