vue的插槽解析

插槽

好处：组件的内容结构可定制 用slot插槽进行占位

语法: 子组件中通过slot进行占位

理解：父组件，在子组件标签嵌套的内容就会被渲染到slot地方

一、默认插槽

//子组件
slot插槽 //方法一

slot插槽 //方法二

//父组件
slot插槽

二、具名插槽

//子组件

通过指定 name 属性来定义一个具名插槽。在使用组件时，可以将内容分发到对应的具名插槽中。

//父组件  v-slot:main

      

 注意：

一、通过v-slot:来查找具名插槽

二、为什么用template, template等于是一个包，不是div盒子，页面是看不到template标签的

三、作用域插槽

作用域插槽的语法: v-slot:slotName="parameter"，其中 slotName 是插槽的名称，parameter 是接收子组件数据的参数。

接收：的是已 对象的形式

//父组件中定义的