需求
模拟器 和ios手机 均不卡，
在安卓手机上很卡
代码
move: function (res) { let left = res.detail.x; console.log("move--"+left) if (left > 0) { this.setData({ left: left }) } else { this.setData({ left: 0 }) } }, |
是setdata的问题么？如果不用setdata还有什么办法更新数据，渲染页面？
安卓手机上频繁setData是会卡的比较明显
试试用 movable-view来做？
用了，不过canvas不能 放到movable-view里面
<view class='view_canvas'>
<view class='con'>
<canvas canvas-id='canvas1' class='canvas'></canvas>
<canvas canvas-id='block' class='block'> </canvas>
<canvas canvas-id='three' class='block' style='top:{{height*0.5}}+80rpx;left:{{left-x}}px'></canvas>
</view>
<view class='cont'>
<movable-area class='route' style="height: 100rpx; width:100%; ">
<movable-view class='view' style="height: 50px; width: 50px; " x="{{left}}" y="{{y}}" direction="horizontal" bindchange="move" bindtouchend='end' >
<image src='/images/you.png' class='slide'></image>
</movable-view>
<label class="tip">向右滑动滑块填充拼图</label>
</movable-area>
</view>
</view>
canva是放到movable-view，还是不行