uview使用SwipeAction 滑动单元格遇到的问题

囧炯炅

已于 2024-09-20 15:50:18 修改

阅读量187

点赞数 3

文章标签：前端服务器 vue.js uni-app

于 2024-09-20 15:49:18 首次发布

本文链接：https://blog.csdn.net/qq_51859583/article/details/142387340

版权

情景：一个消息列表中，左侧滑动删除其中一个，下一个的数据默认是打开的状态

解决：先找到这个组件的源码添加this.status = 'close'

接下来展示如何使用SwipeAction 滑动单元格组件

<view >
					<u-swipe-action>
						<u-swipe-action-item v-for="(item, index) in List" :options="options" :key="item.id" @click="del(item.id)">
							<view class="li" >
								<view class="image">
									<u-avatar :src="item.avatarUrl" size="50"></u-avatar>
								</view>
								<view class="right" @click="toUrl('/pages/message/detail?id=' + item.id)">
									<view class="title">
										<view class="p1">
											{{ hidephone(item.nickName) }}
										</view>
										<view class="dateTime">
											{{ timeDateGsh(item.messageTime) }} {{ formatDate(item.messageTime, 'h:i') }}
										</view>
									</view>
									<view class="con">
										<text>{{ item.messageInfo }}</text>
										<text class="Count" :style="{width: item.Count < 10 ? '35rpx' : item.Count < 10 ? '55rpx' : '60rpx'}" v-show="item.Count">{{ item.Count < 100 ? item.Count : '99+' }}</text>
									</view>
								</view>
							</view>
						</u-swipe-action-item>
					</u-swipe-action>
				</view>