前言:年后入职了一家新公司,与前同事交接完之后,发现公司有一个四端的项目(iOS,Android,H5,小程序),iOS和安卓都实现了左滑右滑的效果,而h5和小程序端没实现,询问得知前同事因网上没找到对应的插件,相关博客也特别少,所以没做就搁置下来了,趁这段时间相对来说比较富裕,于是乎在网上也搜索了一下,发现确实很少,但是有人提到可以用小程序可拖动组件movable-view来实现,自己尝试来一下发现可行,于是来写这篇博客记录一下,希望能帮助到后面需要用到这个功能的人!
先上效果图:
主要技术:Taro+Taro UI+React(如果你是小程序原生或者uniapp+vue写法都差不多,可以通用)
可拖动组件文档地址:
Taro: https://taro-docs.jd.com/taro/docs/components/viewContainer/movable-view.html
微信小程序:https://developers.weixin.qq.com/miniprogram/dev/component/movable-view.html
思路:
一,我们首先把movable-area和movable-view标签写出来;
<movable-area> <movable-view> ...... </movable-view> </movable-area>