用movable-view实现可拖拽的列表元素

wxml： 

<movable-view class="outer">
    <movable-item class="inner" wx:for="sequence"
        bind:change="onChange" bind:touchstart="touchstart" bind:touchend="touchend">
        ....
    </movable-area>

    ......
</movable-view>

wxss:

.outer{
    width:100%;
    height:100%;
    padding: 0 8px;
}
.inner{
    display:inline-block;
    position:relative;
    width:unset;
    height:unset;
    margin:2px 1px 2px 2px;
}

效果类似于：

这样可以使元素不堆叠。 再设置movable-view的bind:change, bind:touchstart, bind:touchend方法监听移动即可。有时移动后不刷新内容显示，可以修改sequence的长度进行强制刷新。

 

不过movable-view的上下padding在内容有margin的时候貌似计算不准确，比如如果把外层的padding改成8px，则出现以下情况：

最后一行出线了错位情况。。不知道是什么原因。