vue el-table 行内拖拽

1.安装Sortable.js

npm install sortablejs --save

2.在页面中引入：

import Sortable from ‘sortablejs’

<el-table :data="tableData"  row-key="id" @selection-change="handleSelectionChange" ref="multipleTable">
                <el-table-column type="selection" width="55" >
                </el-table-column>
                <el-table-column v-for="(item, index) in col"   :key="`col_${index}`"
                                 :prop="dropCol[index].prop"    :label="item.label">
                </el-table-column>
                <el-table-column label="必选项" width="65">
                <template slot-scope="scope">
                <el-checkbox class="checkbox_inner" @change="handleSelection(scope.$index,scope.row)"></el-checkbox>
                <!--<el-radio :label="scope.$index" v-model="radio" @change.native="getCurrentRow(scope.row)"></el-radio>-->
              </template>
              </el-table-column>
            </el-table>

mounted 调用

mounted () {
  this.rowDrop();
},
methods: {
   //行内拖拽
   rowDrop () {
     // 此时找到的元素是要拖拽元素的父容器
     const tbody = document.querySelector(".el-table__body-wrapper tbody");
     Sortable.create(tbody);
   },
}