1、子组件写法:slot上直接绑定属性,name指定插槽名称与父组件匹配;

<div class="test-slot">
     <slot :data1='data1'></slot>
     <slot name='main' :data2='data2'></slot>
</div>

2、父组件写法:v-slot:【插槽名】='scope', 如: scope={data1: data1};

<div>
  <template v-slot:default='scope'>{{scope.data1}}</template>
  <template v-slot:main='{ data2 }'>{{ data2 }}</template>
</div>

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐