antd table设置固定列'fixed',Sortablejs失效

问题介绍：

a-table设置固定列之后，表格无法排序，Sortablejs失效

图片.png

Sortablejs使用：

 //  拖拽排序方法
    dragSort () {
      const tableSort = this.$refs.tableSort
      this.sortable = Sortable.create(tableSort.$el.querySelector('tbody'), {
        handle: '.drag-btn',
        onEnd: ({ newIndex, oldIndex }) => {
          const currRow = this.data.splice(oldIndex, 1)[0]
          this.data.splice(newIndex, 0, currRow)
          this.codeTableSort(this.data)
        }
      })
    },

解决：

思路：设置fixed: 'right'后，会生成一个新表格(只有操作列），如图蓝色部分，原来的写法绑定的是原表格的tbody,将它变成新表格的tbody

蓝色为新表格

写法：

//  拖拽排序方法
    dragSort () {
      const tableSort = this.$refs.tableSort
      console.log('tableSort', tableSort)
      // 获取页面中排序需要的表格tbody
      // var array = document.getElementsByTagName('tbody') // 所有tobody
      // 另外一种获取方法
      var array = tableSort.$el.querySelectorAll('tbody') // 所有tobody
      console.log('array', array)
      // 查看所有tbody
      for (var i = 0; i < array.length; i++) {
        console.log(i, array[i])
      }
      this.sortable = Sortable.create(array[1], {
        handle: '.drag-btn',
        onEnd: ({ newIndex, oldIndex }) => {
          const currRow = this.data.splice(oldIndex, 1)[0]
          this.data.splice(newIndex, 0, currRow)
          this.codeTableSort(this.data)
        }
      })
    },

参考：
思路超级好，就是感觉好复杂

解决bootstrap table固定列复选框失效 (bootstrap-table-fixed-columns)