p***@gmail.com
p***@gmail.com
  • 发布:2025-11-12 16:24
  • 更新:2025-11-12 16:27
  • 阅读:49

v-for 循环时使用命名插槽

分类:uni-app

子组件代码如下:

<slot :name="'cargo_name_' + index"/>

上述的 index 在子组件代码中有, 可以理解为 slot name 依次为 cargo_name_0cargo_name_1...

父组件使用:

<text v-for="(goodItem, goodIndex) in list" :key="goodIndex">  
    <template slot="cargo_name_{{goodIndex}}">  
        <text class="unit-tag">{{goodItem.unit}}</text>  
    </template>  
</text>

然而在微信小程序中未正确渲染出命名插槽, 但是使用微信开发者工具 wxml 查看元素, 能看到命名插槽, 只是没有插入相应元素进去, 问题出在父组件的 v-for 命名插槽那里, 也就是 <template slot="cargo_name_{{goodIndex}}">

2025-11-12 16:24 负责人:无 分享
已邀请:
p***@gmail.com

p***@gmail.com (作者)

在 mainfest.json mp-weixin 中已配置 scopedSlotsCompiler 为 augmented

DCloud_UNI_OttoJi

DCloud_UNI_OttoJi - 日常回复 uni-app/x 问题,如果艾特我没看到,请主动私信

不建议这样使用,参考 https://uniapp.dcloud.net.cn/tutorial/vue-components.html#%E5%85%B7%E5%90%8D%E6%8F%92%E6%A7%BD

要回复问题请先登录注册