VUE之---slot插槽

什么是插槽

slot 【插槽】, 是 Vue 的内容分发机制, 组件内部的模板引擎使用slot 元素作为承载分发内容的出口。slot子组件的一个模板标签元素, 而这一个标签元素是否显示, 以及怎么显示是由父组件决定的。

VUE中slot【插槽】的分类与应用

插槽有三种:默认插槽具名插槽作用域插槽

(1)默认插槽

语法

示例

在子组件中定义一个默认插槽

在开发中我们经常使用到组件之间的传值,但很多情况涉及到的都是数据属性的传值,现在如果是这种情况:想让父组件定义的 p 标签传给子组件并显示,可以在子组件中定义一个默认插槽




 展示效果

(2)具名卡槽 

在子组件中定义插槽时,给对应的插槽分别起个名字,方便后边插入父组件将根据 name 来填充对应的内容。这种有name属性的卡槽就是具名卡槽。

为具名插槽提供内容:

在向具名插槽提供内容的时候,我们可以在一个