uniapp uni-swipe-action 点击事件 iOS不支持 问题排查

真是怪事年年有, 今年特别多, uni-swipe-action 滑动操作组件,
Android 好好的 iOS 几款手机都会出现事件传递
uni-swipe-action-item 套 view, click事件给了uni-swipe-action-item 里面的view click 也触发了

1. 场景代码如下:

<uni-swipe-action>
					<uni-swipe-action-item v-for="(item,index) in agendaList" :key="index"
						:disabled="isUpdateOrDel(item)" :right-options="options" @change="handleSwipe"
						@click="swipeClick($event,index)">
						<view  @click="toDetail(item)">
						</view>
					</uni-swipe-action-item>
</uni-swipe-action>

2. 怎么能阻止事件传递 (事件修饰符):

在这里插入图片描述

3.事件修饰符

虽然事件修饰符, .stop 和 e.stopPropagation 等同, 但uniapp 里 不好使, 只能用修饰符

4. 改源码

你用左滑 就改class 为 --left 的
右滑就搞 --right的
其次就是
touchend
touchstart
加上修饰符.stop

<view class="uni-swipe_button-group button-group--right">
				<slot name="right">
					<view v-for="(item,index) in rightOptions"  :key="index" :style="{'z-index':999,
					  backgroundColor: item.style && item.style.backgroundColor ? item.style.backgroundColor : '#C7C6CD',
					  fontSize: item.style && item.style.fontSize ? item.style.fontSize : '16px'
					}" class="uni-swipe_button button-hock" @touchstart.stop="appTouchStart"
						@touchend.stop="appTouchEnd($event,index,item,'right')"
						@click.stop="onClickForPC(index,item,'right')"><text class="uni-swipe_button-text"
							:style="{color: item.style && item.style.color ? item.style.color : '#FFFFFF',}">{{ item.text }}</text>
					</view>
				</slot>
			</view>

5.错误的改法就是把click 搞成 click.stop ;

我头一次也这么想的, 不过控制台提示,包装的click是方法 不是事件… 不支持

<uni-swipe-action>
					<uni-swipe-action-item v-for="(item,index) in agendaList" :key="index"
						:disabled="isUpdateOrDel(item)" :right-options="options" @change="handleSwipe"
						@click="swipeClick($event,index)">
						<view  @click="toDetail(item)">
						</view>
					</uni-swipe-action-item>
</uni-swipe-action>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值