ant design vue+sortable.js配合开关控制实现table表格拖拽功能，element组件同理

第一步：下载sortablejs插件

npm install sortablejs --save

第二步：在页面中引入sortablejs

import Sortable from 'sortablejs'

第三步：代码示例

如果需要实现开关可控制的表格拖拽功能，可以通过v-if或v-show指令控制Table组件的显示与隐藏，在开关被关闭时禁用sortable功能，在开关被打开时启用sortable功能。

以下是一个示例代码：

<template>
  <div>
    <a-switch v-model="dragEnabled">表格拖拽</a-switch>
    <a-table :columns="columns" :data-source="dataSource" v-if="dragEnabled" :row-key="record => record.id">
      ...
    </a-table>
    <a-table :columns="columns" :data-source="dataSource" v-else :row-key="record => record.id">
      ...
    </a-table>
  </div>
</template>

<script>
  import Sortable from 'sortablejs';

  export default {
    components: {
      'a-table': Table,
      'a-switch': Switch,
    },
    data() {
      return {
        dragEnabled: false,
        columns: [
          {
            title: '姓名',
            dataIndex: 'name'
          },
          ...
        ],
        dataSource: [
          { id: 1, name: '张三', ... },
          { id: 2, name: '李四', ... },
          ...
        ],
      };
    },
    mounted() {
      // 在Table组件渲染完毕后启用或禁用sortable功能
      this.$nextTick(() => {
        if (this.dragEnabled) {
          this.enableDrag();
        } else {
          this.disableDrag();
        }
      });
    },
    watch: {
      // 监听dragEnabled属性的变化，启用或禁用sortable功能
      dragEnabled(value) {
        if (value) {
          this.enableDrag();
        } else {
          this.disableDrag();
        }
      },
    },
    methods: {
      // 启用sortable功能
      enableDrag() {
        const tableEl = this.$el.querySelector('.ant-table-tbody');
        const sortable = Sortable.create(tableEl, {
          animation: 150,
          onEnd: this.onDragEnd, // 拖拽结束后更新数据源顺序
        });
        this.sortable = sortable;
      },
      // 禁用sortable功能
      disableDrag() {
        if (this.sortable) {
          this.sortable.destroy();
          this.sortable = null;
        }
      },
      // 拖拽结束后更新数据源顺序
      onDragEnd(evt) {
        const { oldIndex, newIndex } = evt;
        const record = this.dataSource.splice(oldIndex, 1)[0];
        this.dataSource.splice(newIndex, 0, record);
      },
    },
  };
</script>