前言

运营小姐姐说想要可以直接拖拽排序的功能，原来在序号六的广告可能会因为金主爸爸加钱换到序号一的位置，拖拽操作就很方便

效果

实现方式

模板部分

El-table v-loading=' loading ' :默认-sort=' { prop : ' sortNum '，order: '升序} ' : data=' list '边框对齐=' left ' El-table-cold-show-overflow-tooltip v-for='(项，索引)在col ' :键=' col _ $ { index } ` ' : prop=' col[index]中道具' :标签='项目.标签'模板slot-scope=“scope”p { { scope。行[项。道具]}/p/模板/El-表格-列/El-表格脚本部分

从"可排序的js "导入可排序的导出默认{ components: { Sortable }，data(){ return { col :[{ label : }位置，prop: 'location' }，label: '序号，prop: 'sortNum' }，label: '经办人，prop: 'operator' }，label: '操作，prop: 'isClick' } ] })，mounted() { this.rowDrop() }，methods : { RowDrop(){ const t body=document。querySelector(' .El-table _ _ body-wrapper t body ')const _ this=this可排序。create(tbody，{ onEnd({ newIndex，oldIndex }){ const curr row=_ this。名单。拼接(oldIndex，1)[0]_ this。名单。拼接(新索引，0，当前行)_ this。list=_ this。名单。筛选器({ ADid })=ADid！==0) _this.list.forEach((项，索引)={ _ this。排序字符串=项目。ADid ' : '(索引1 '，' })_ this。排序字符串=_ this。排序字符串。substr(0，_ this。排序字符串。长度-1)} } } }完成！你们可以看得懂的！你可以你能行！

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。