vue3中slot-scope怎么用
时间: 2024-03-26 07:20:20 浏览: 72
vue template中slot-scope/scope的使用方法
可以使用v-slot指令替代slot-scope,在模板中使用v-slot:default或简写为#default,再在v-slot中放置参数就可以使用参数来访问作用域插槽的内容。例如:
<template>
<ul>
<li v-for="item in items" :key="item.id">
<slot :item="item"></slot>
</li>
</ul>
</template>
<my-component>
<template #default="{ item }">
{{ item.title }}
</template>
</my-component>
在上述示例中,我们使用v-slot:default(或简写为#default)指令在my-component组件的模板中定义一个作用域插槽,并且用参数item来访问插槽中传递过来的数据。
阅读全文