使用移动端触摸事件touchstart、touchend来动态改变swipe的touchable属性值。
代码如下:
<div @touchstart="swipeClick($event)" @touchend="swipeClickEnd" id="newEnergyTabCard">
<van-swipe @change="onChange" ref="newEnergySwipe" :touchable="touchable">
<template #indicator>
</template>
<van-swipe-item class="tab">
</van-swipe-item>
<van-swipe-item class="tab">
</van-swipe-item>
</van-swipe>
</div>
swipeClick(event) {
// 获取第一个触点
let touch = event.touches[0];
// 页面触点Y坐标
let y = Number(touch.pageY);
// 滑动div距离页面高度
let newEnergyDivOffsetTop = document.getElementById("newEnergyTabCard").offsetTop;
// 滑动div本身高度
let newEnergyDivHeight = document.getElementById("newEnergyTabCard").offsetHeight;
if(y > newEnergyDivOffsetTop + newEnergyDivHeight * 0.3) {
// this.$refs.newEnergySwipe.touchable = false;
this.touchable = false;
}
},
swipeClickEnd() {
this.touchable = true;
},
因篇幅问题不能全部显示,请点此查看更多更全内容
Copyright © 2019- oldu.cn 版权所有 浙ICP备2024123271号-1
违法及侵权请联系:TEL:199 1889 7713 E-MAIL:2724546146@qq.com
本站由北京市万商天勤律师事务所王兴未律师提供法律服务