自定义组件ft-test:
<template>
<view class="ft-test">
<view v-for="(p, index) in protocols" :key="index">
<slot name="test-slot" :protocol="p">
<text>test-slot-{{ index }},</text>
</slot>
第{{ index }}条数据
</view>
</view>
</template>
<script>
export default {
name: 'ft-test',
props: {
protocols: {
type: Array,
default: () => []
}
},
data() {
return {}
},
created() {
console.log('ft-test-this----', this, this.$slots)
console.log('ft-test-$scopedSlots----', this.$scopedSlots)
}
}
</script>
页面中使用ft-test组件:
<ft-test :protocols="[{title: '步骤1'}, {title: '步骤2'}, {title: '步骤3'}]">
<text slot="test-slot" slot-scope="{protocol}">test-slot-{{ protocol.title }},</text>
</ft-test>
1 个回复
DCloud_UNI_yuhe
你是写法有问题吧,看起来在:slot-scope="{protocol}",这个地方加一个:就能获取了