插槽solt,vue中的一个简单但又常常被忽视的一个知识点,尤其对一个前端的新手来说,我不知道自己都复习了多少遍,但是对这边的知识比较模糊,今天就总结一下:
1.什么叫插槽:插槽(solt)是vue为组件的封装者提供的能力,允许开发者在封装组件的时候,把不确定的由用户指定的部分定义为插槽(v-slot的简写形式:#)
2.solt的分类: 匿名插槽 具名插槽 默认插槽 作用域插槽
具名插槽与匿名插槽一样,只是匿名插槽默认的name,name="default"省略了
2.1匿名插槽:
父组件
子组件:
2.2默认插槽:封装组件时,可以为预留的<solt>插槽提供默认内容,如果组件的使用者没有为插槽提供任何内容,则后备内容会生效
当我们不给组件指定的具体的插槽的内容,我们只想用默认插槽,当具名插槽的内容与默认插槽的内容都同时存在的时候,具名插槽的优先级大于默认插槽的优先级,显示具名插槽的内容. 只要我们在slot标签内添加内容,添加的内容就是默认的
2.3具名插槽:插槽 具有name属性的插槽
父组件:注意:v-slot指令加在 template元素身上,并且v-slot属性后面要指定插槽的名字
子组件 :