👨🏻💻 热爱摄影的程序员
👨🏻🎨 喜欢编码的设计师
🧕🏻 擅长设计的剪辑师
🧑🏻🏫 一位高冷无情的编码爱好者
大家好,我是全栈 IT 工程师摘星人
欢迎分享 / 收藏 / 赞 / 在看!
uView 官网 - SwipeAction 滑动单元格
【需求】每一项可以左滑,点击删除该项
【问题1】向左滑动,其他的项不能关闭
【解决】v-for 要在 u-swipe-action-item 层进行,并且 key 要唯一(最好不要用索引 index)
<u-swipe-action>
<u-swipe-action-item v-for="item in dataLists" :key="item._id" :options="optionsSwipe" @click="clickSwipe(item)" :name="item._id">
<view class="item item-bg" @click="clickItem(item._id)">
<view class="top">
<view class="title">
{{item.title}}
</view>
</view>
</view>
</u-swipe-action-item>
</u-swipe-action>
【问题2】点击删除后,删除按钮不能自动关闭
【解决】修改组件源码
修改 u-swipe-action-item.vue
代码,找到 buttonClickHandler
事件,添加 this.status = 'close'
。即点击按钮后将状态置为 close。