插槽

插槽

1. 插槽的定义

插槽：Vue为组件的封装者提供的能力。允许开发者在封装组件时，把不确定的、希望由用户指定的部分定义为插槽。

【理解】：组件封装期间为用户预留的内容占位符。

2. slot标签的使用

之前我们使用组件时，在标签中间没有任何内容，比如< Left>< /Left>，如果在封装Left组件时预留了插槽slot，则可以在标签中加内容！

如果在Left组件中没有slot插槽，则在使用者App中Left标签中的p标签则不会显示。

3. 后备内容插槽

如果用户没有指定插槽的具体内容是什么，那么插槽的位置就展示默认内容（后备内容）

那如果在封装组件的时候预留了多个插槽节点，如何将我想指定的内容插入到某个具体的插槽中？

4. 具名插槽

slot元素中的name属性可以定义和区别不同的插槽。

如果< slot>不带name属性值，则默认为default。

怎么在使用组件时插入指定的插槽？

v-slot指令

< p v-slot=”s1”>

v-slot只能在组件或者是template标签中使用

其中，template标签只是一个虚拟的标签，起到包裹性质的作用，不会被渲染成任何实质性的html元素。

5. 作用域插槽

slot本身是有作用域的，即父作用域和子作用域，它们是各自渲染的，也就是说，父作用域无法拿到子作用域中的数据

那么有时候我们希望在父作用域拿到子作用域的数据或者对子组件的显示进行控制怎么办？