// 引入
import Sortable from 'sortablejs';
mounted(){
// 这里使用nextTick是因为dom可能没有加载出来 ,加个延迟,当然了 如果你是接口获取到的数据 你就可以直接在获取到数据之后绑定事件
this.$nextTick(()=>{
setTimeout(()=>{
this.rowDrop();
},500)
})
},
rowDrop() { // 行拖拽
const tbodys = document.querySelector('.container_table2 .el-table__body-wrapper tbody') //这里是拖拽的内容体
const _this = this;
Sortable.create(tbodys, {
onEnd({ newIndex, oldIndex }) {
// 这里修改拖拽之后的数据
const currRow = _this.tableData.splice(oldIndex, 1)[0];
_this.tableData.splice(newIndex, 0, currRow);
}
});
},
拖拽之后信息混乱,加上row-key给列表绑定唯一的key,就不会有数据混乱啦