<template>
<view class='page'>
<text class="_item" @touchmove="ontouchmove" :style="{left:x+'px',top:y+'px'}">
触摸点
</text>
</view>
</template>
<script setup>
import {ref} from 'vue'
let x = ref(0),y=ref(0)
const ontouchmove =(event)=>{
const { pageX, pageY } = event.touches[0];
console.log(pageX, pageY);
x.value = pageX
y.value = pageY
}
</script>
<style lang="scss">
.page{
flex: 1;
}
._item{
width: 100rpx;
height: 80rpx;
border: 1px solid;
font-size: 26rpx;
display: flex;
align-items: center;
justify-content: center;
}
</style>
hikerw
- 发布：2022-08-29 13:42
- 更新：2022-08-29 14:51
- 阅读：285
产品分类： uniapp/App
PC开发环境操作系统： Mac
PC开发环境操作系统版本号： 12.5.1
HBuilderX类型： 正式
HBuilderX版本号： 3.5.5
手机系统： Android
手机系统版本号： Android 12
手机厂商： 华为
手机机型： p7
页面类型： nvue
vue版本： vue3
打包方式： 云端
项目创建方式： HBuilderX
示例代码：
操作步骤：
直接贴入示例代码
直接贴入示例代码
预期结果：
安卓端正常监听滑动 不抖动
安卓端正常监听滑动 不抖动
实际结果：
安卓端监听触摸事件疯狂抖动
安卓端监听触摸事件疯狂抖动
bug描述：
触摸事件 ontouchmove 在h5和ios端均正常 安卓端异常抖动
2 个回复
CODE_XU
uni-app 是逻辑层和视图层分离的。此时会产生两层通信成本。比如拖动视图层的元素，如果在逻辑层不停接收事件，因为通信损耗会产生不顺滑的体验。
这种操作建议使用 BindingX
hikerw (作者)
已解决
KKMWDN
如何解决的呢
2024-01-16 11:15