小程序Android版本touchmove 事件侦听
发布于 7 年前 作者 weipeng 17949 次浏览 来自 问答
  • 当前 Bug 的表现(可附上截图)

    在安卓端绑小程序定一个view 的touchmove 事件时,纵向触摸滑动每秒只有5次事件回调

    但是用网页端复现的时候表现正常

  • 预期表现
  • 复现路径
  • 提供一个最简复现 Demo

小程序代码:

  • index.wxml

<view class=“layer” bindtouchmove=“layerMove”>   

    <text>{{touchMovesPerSecond}}</text>

</view>

  • index.js

const app = getApp()

Page({

    data: {

        touchMovesPerSecond: 0

    },

    touchMovesArray: [],

    layerMove: function(event) {

        this.touchMovesArray.push(new Date())

        const now = new Date()

        this.touchMovesArray = this.touchMovesArray.filter(time => time > now - 1000)

        this.setData({

            touchMovesPerSecond: this.touchMovesArray.length

        })

    }

})

--------------------------------------------分界线------------------------------------------

Web 端代码:

<!DOCTYPE html>

<html>

<head>

    <title></title>

    <style type=“text/css”>

        body, html {    

            background-color: #4e4d4d;

            margin: 0px;

            padding: 0px;

            height: 100%;}

        #container {

            background-color: red;

            height: 100%;

        }

    </style>

</head>

<body>

    <div id=“container”>

        <p id=“count”></p>

    </div>

    <script>

        const touchMovesArray = []

        const handleMove = function() {

            touchMovesArray: [],

            touchMovesArray.push(new Date())

            const now = new Date()

            touchMovesArray = touchMovesArray.filter(time => time > now - 1000)

            document.querySelector(’#count’).innerHTML = touchMovesArray.length

        }

        var el = document.querySelector(’#container’)

        el.addEventListener(“touchmove”, handleMove, false);

    </script>

</body>

</html>

4 回复

同问,我是下拉,安卓机卡的要死

+1 我们也有这个问题

由于小程序的逻辑和视图引擎是异步分离的,无法做到流畅。需要修改实现方式,或者不采取需要拖动的解决方案。

回到顶部