ant table表头行列拖拽切换位置

import Sortable from 'sortablejs'

   
 // 行拖拽
    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)
        }
      })
    },
    /** 列拖拽 */
    columnDrop() {
      const wrapperTr = document.querySelector('.ant-table-thead tr')
      this.sortable = Sortable.create(wrapperTr, {
        animation: 180,
        delay: 0,
        onEnd: (evt) => {
          const oldItem = this.tableColumns[evt.oldIndex]
          this.tableColumns.splice(evt.oldIndex, 1)
          this.tableColumns.splice(evt.newIndex, 0, oldItem)
        }
      })
    },

      rankingList(params)
        .then((res) => {
          this.tableData = res.records
          this.pageObj.total = Number(res.total)
          this.pageObj.current = Number(res.current)
          this.columnDrop()  // 获取完数据智慧调用
          // this.pageObj.size = res.size
        })
        .finally((e) => {
          this.tableLoading = false
        })