一个数据表需要3个scroll-view配合展示数据,如下图:(scroll-view)简称sv, 当sv1左右滑动时,要求sv3也同步左右滑动;当sv2上下滑动时,要求sv3也同步上下滑动;当sv3左右滑动时,要求sv1也同步左右滑动;当sv3上下滑动时,要求sv2下同步上下滑动;
问题:当其中一个sv被触动滑动效果时,与之联动的另一个sv没有及时同步跟着滑动,会产生错位现象。实现原理是::当其中一个sv被触动滑动时,该sv触发bindscroll事件,并在此事件中获取该sv的x,y坐标,用来改变与之关联的sv的scroll-left或scroll-top值。
如果能直接取消这3个scroll-view的手触动滑动效果,通过代码改变它们的scroll-left、scroll-top值,那么可以在它们的容器上面通过bindtouchmove事件来计算横纵滑动间距来同时改变其中任何两个sv的scroll-left或scroll-top值。但使用此方案前提必须要让图里的3个sv的手触滑动失效,目前没找到比较有效的办法让其手触滑动失效。
请教大神,有没有更好的解决方案?
该问题已经解决,并且已经封闭为组件,需要的朋友可以访问本人的CSDN技术博客,上面有使用方法,及组件下载地址
真机上顺滑吗 不卡顿吗
请问楼主解决了吗?我也和你同样的布局,也是实现同样的功能,也遇到了卡顿的问题,目前还是没有解决这个问题
你可以试下bindscroll使用wxs事件绑定,在wxs里面设置其他二个的style,wxs事件可以设置setStyle的,修改他们的transform。你可以参考下里面的案例。https://developers.weixin.qq.com/miniprogram/dev/framework/view/interactive-animation.html