Vue - 插槽的基本使用（笔记）

目标: 组件基础使用
        场景: 组件底座(基本)样式不变, 插入的标签不同
                 传入数据用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身上所有属性和值