vue学习(五)基础入门-基础知识(12)-slot 插槽

什么是插槽?
插槽(Slot)是Vue提出来的一个概念,正如名字一样,插槽用于决定将所携带的内容,插入到指定的某个位置,从而使模板分块,具有模块化的特质和更大的重用性
插槽显不显示、怎样显示是由父组件来控制的,而插槽在哪里显示就由子组件来进行控制

[email protected] 开始,Vue 为具名和范围插槽引入了一个全新的语法,即我们今天要讲的主角:v-slot 指令。目的就是想统一 slot 和 slot-scope 语法,使代码更加规范和清晰。既然有新的语法上位,很明显,slot 和 scope-slot 也将会在 [email protected] 中彻底的跟我们说拜拜了。而从 [email protected] 开始,官方推荐我们使用 v-slot 来替代后两者。

跟 v-on 和 v-bind 一样,v-slot 也有缩写,即把参数之前的所有内容 (v-slot:) 替换为字符 #。例如 v-slot:header 可以被重写为 #header:

v-slot的出现是为了代替原有的slot和slot-scope
简化了一些复杂的语法。
一句话概括就是v-slot :后边是插槽名称,=后边是组件内部绑定作用域值的映射。

为什么使用slot

slot的基本使用

具名slot

编译作用域

作用域插槽

发布了49 篇原创文章 · 获赞 61 · 访问量 1万+

猜你喜欢

转载自blog.csdn.net/wuyxinu/article/details/103013353