<view class="main" v-else-if='addrList.length'>
<u-swipe-action autoClose ref="swipeAction" class="swipe-container">
<u-swipe-action-item :options="btnDel" @click='del(idx, i.addrId)' :ref="'swipeAction' + idx"
v-for="(i, idx) in addrList" :key="i.addrId">
<addr-card :addr="i" @putAddr="putAddr" />
</u-swipe-action-item>
</u-swipe-action>
</view>
重点: :ref=“‘swipeAction’ + idx”
async del(idx, id) {
await delAddrAPI(id)
// 处理u-swipe-action-item不复位的问题 **重点这两行代码**
let index = 'swipeAction' + idx
this.$refs[index][0].closeHandler()
// 优化-无刷新更新
let delIndex = this.addrList.findIndex(i => i.addrId == id)
this.addrList.splice(delIndex, 1)
uni.$u.toast("删除成功");
},
文章介绍了如何在Vue应用中,使用u-swipe-action组件实现列表项的删除操作,包括调用API、处理ref更新和无刷新更新列表的方法。重点在于处理u-swipe-action-item组件关闭时的复位问题。



6238

被折叠的 条评论
为什么被折叠?



