React中使用sortablejs实现拖拽排序

3,394 阅读1分钟

1、使用npm装包

$ npm install sortablejs --save

2、引入Sortable

import Sortable from "sortablejs";

3、使用方法

<div className="grid-box" ref={this.sortableGroupDecorator}>
    {menus &&
        menus.map((item, i) => {
            return this.renderSelectedItemView(item, i);
        })}
</div>
sortableGroupDecorator = componentBackingInstance => {
    if (componentBackingInstance) {
        let options = {
            draggable: ".rows",
            animation: "150",
            onEnd: evt => {
                let children = evt.to.children;
            }
        };
        Sortable.create(componentBackingInstance, options);
    }
};