Vue element-ui 表格列可拖动

如何解决Vue element-ui 表格列可拖动

我现在用它做桌子。 但是表格的标题现在可以拖动。如何拖动表格的列？

<el-table
ref="tableRef"
class="table-responsive table-flush"
:data=tableData"
row-key="id"
header-row-class-name="thead"
@sort-change="sortChange"

<el-table-column label="Address" min-width="200px" prop="address">
                <template #default="{ row }">
                    <span>{{ row.address }}</span>
                </template>
            </el-table-column>

            <el-table-column label="Amount" min-width="150px" prop="commitment">
                <template #default="{ row }">
                    <span>{{ row.amount }} {{ shortCurrency }}</span>
                </template>
            </el-table-column>
            <el-table-column
                label="Claimable"
                min-width="130px"
                prop="total"
            >
                <template #default="{ row }">
                    <span>
                        {{ row.amount / currentPrice }}
                    </span>
                </template>
            </el-table-column>
</el-table>


mounted() {
this.initializeTable()
},method: {
initializeTable() {
const theadColumn = this.$refs.tableRef.$el.querySelector(
'.el-table__header-wrapper .el-table__header thead tr'
)
Sortable.create(theadColumn,{
draggable: 'th',onEnd: this.dragReorderColumn,})
},

}

我想在拖动表格标题时同时移动表格的标题和正文。 我正在使用 vue element-ui。 可能吗？