目标: 组件基础使用
场景: 组件底座(基本)样式不变, 插入的标签不同
传入数据用props, 传入标签用插槽
术语: 对组件分发不同标签的一种技术
(重要)口诀:
1. 组件内, 使用slot占位
2. 父组件上, 使用子组件, 标签夹着的地方传入具体标签替换到slot上
目标: 插槽默认内容
口诀: 在slot标签夹着的地方写入默认内容
效果: 不给slot传入具体标签, 显示默认内容
目标: 具名插槽
场景: 组件内遇到多个slot
口诀:
1. 在slot标签上加name属性别名
2. 在使用组件时, 标签夹着地方用template配合v-slot:插槽名
效果: 把template夹着的内容配合v-slot分发给对应名字的slot标签处
目标: 作用域插槽
场景: 使用组件插槽时, 想使用组件内变量(绑定)
口诀:
1. 子组件内, slot上自定义属性和组件内要传出的值(变量)
2. template身上v-slot="临时变量名"
效果: 临时变量名就会收集对应slot身上所有属性和值