vue组件----插槽的使用

 插槽：形象的说就是挖个坑，等着组件的使用者进行填充

插槽的本质：内容分发，子组件写了插槽，父组件可以将其内容直接放到页面上

用来实现组件内容的分发，通过slot标签，可以接收到写在 组件标签内 的内容

vue提供组件插槽的能力，允许开发者在封装组件时，把不确定的部分定义为插槽

让父组件可以向子组件指定位置插入html结构，也是一种组件间通信的方式，

                                  适用于父组件===>子组件（父传子）

父组件中 ：<子组件>hello world

子组件中： 
                 

我是子组件

那么页面上的渲染结果为：

hello world

我是子组件 

也就是说子组件标签中的内容属于父组件，因为作用域问题不会直接被识别， 除非也属于子组件才能在页面中进行渲染，所以通过在子组件中进行占位，在子组件中的位置在哪，hello world就会在哪渲染出来。

即：子组件标签内的所有内容都会通过子组件的进行渲染，就相当于子组件中的插槽是形参，而父组件中子组件标签内的内容是实参。

---

---

默认(匿名)插槽

对于插槽，默认名字为 default 

若没有给插槽传入内容，当需要一个默认内容时，则默认内容将会在页面渲染

若有内容传入插槽时，默认内容将会被覆盖

子组件中可以有多个插槽，若都是匿名插槽，则这些插槽都会接收到同样的信息进行渲染，所以和匿名插槽相对的就是具名插槽

---

---

具名插槽

一个组件有时候可以有多个插槽，为了将这些插槽区分开，也就有了具名插槽

当一个组件内有2处以上需要外部传入不同标签的地方

子组件：给插槽进行命名----title和price

父组件：v-slot:  可以用#进行简写，但必须有具体参数名字才可以

用