slot插槽

标签：slot index vue 作用域 插槽 具名 组件

插槽，也就是槽，是组件的一块HTML模板，这块模板显示不显示，以及怎样显示由父组件来决定。
插槽分为：匿名插槽| 具名插槽| 作用域插槽
1、匿名插槽
它不用设置名称属性，可以放置在组件的任意位置；可以理解为父传入样式及内容，子负责展示
index.vue 父组件

• 1
• 2

• 1
• 2

slot2.vue   子组件 2、具名插槽 插槽加了名称属性，就变成了具名插槽。具名插槽可以在一个组件中出现Ñ次，出现在不同的位置 index.vue 父组件  

具名插槽n1

     

具名插槽n2

• {{v}}

  slot2.vue   子组件 3、作用域插槽 官方叫它作用域插槽，实际上，对比前面两种插槽，我们可以叫它带数据的插槽。 什么意思呢，就是前面两种，都是在组件的模板里面写 作用域插槽跟单个插槽和具名插槽的区别，因为单个插槽和具名插槽不绑定数据，所以父组件提供的模 板一般要既包括样式又包括内容， 而作用域插槽，父组件只需要提供一套样式（在确实用作用域插槽绑 定的数据的前提下）相当于父组件提供一套样式，数据都是子组件的。 index.vue 父组件     {{scope.title}}   slot2.vue   子组件 子组件中传入数组 index.vue 父组件  

• {{v}}

 

标签：slot,index,vue,作用域,插槽,具名,组件
From： https://www.cnblogs.com/jycom/p/16615547.html