vue3.0的插槽

搜索个人公众号
前端交流
或者加个人学生党v
q5281951
欢迎一起学习前端

vue2.6 使用 父组件slot=“name” slot-scope=“data” 可以使用div或template
vue3.0 使用父组件v-slot:name="data"或者#name=“data”
子组件
两个都一样

作用域与具名插槽必须一起使用 不然没有效果 无法确定具名作用域

<p>
  <child>
  <template v-slot:tou="data">
  //data可以任意取名 名字.子组件绑定名字 这样形式获取参数
  touj
  <span>{{data.data}}</span>
  </template>
  </child>
 </p>

子组件

<slot name="tou" :data="num">header</slot>
//data可以任意取名是父组件接收的key
 <slot name="footer">foo</slot>
<scip