实现步骤
1.安装sortable
npm install sortablejs --save
2.引入sortable
import Sortable from 'sortablejs'
3.编写 rowDrop方法实现行拖拽
methods: {
/** Sortable 行拖拽 */
rowDrop() {
const tbody = document.querySelector(".ant-table-tbody"); // 元素选择器名称根据实际内容替换
const _this = this;
Sortable.create(tbody, {
// 官网上的配置项,加到这里面来,可以实现各种效果和功能
animation: 150,
ghostClass: "blue-background-class",
onEnd({ newIndex, oldIndex }) {
const currRow = _this.tableData.splice(oldIndex, 1)[0];
_this.tableData.splice(newIndex, 0, currRow);
}
});
}
}
4.在mounted里面执行
mounted() {
this.rowDrop();
}