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

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐