悬浮拖拽问题
发布于 6 年前 作者 guiyingxiong 4405 次浏览 来自 问答

自己写了个可拖拽的悬浮球,拖动的时候没办法像官方按钮那样流畅,会出现卡顿现象,请教大神们有没有可优化的地方。

附上js:

ballTouchMove: function (e) {

    console.log(‘我被拖动了…’, e)

    var touchs = e.touches[0];

    var pageX = touchs.clientX;

    var pageY = touchs.clientY;

    //防止坐标越界,view宽高的一般  

    if (pageX < 30) return;

    if (pageX > this.data.screenWidth - 30) return;

    if (this.data.screenHeight - pageY <= 30) return;

    if (pageY <= 30) return;

    var x = this.data.screenWidth - pageX - 30;

    var y = this.data.screenHeight - pageY - 30;

    var menu = this.data.menuBall

    menu.right = x * 2

    menu.bottom = y * 2

    this.setData({

        menuBall: menu

    })

},

1 回复

频繁 setData 是容易导致性能问题的。

这里可以用 类似 debounce 的方式保证不要过于频繁地调用 setData,同时配合 CSS3 动画,可以尝试一下是否可以达到流畅效果。

回到顶部