Sortable icon indicating copy to clipboard operation
Sortable copied to clipboard

[bug] 当列配置了fixed="left"后,拖拽无效

Open Gemini-0529 opened this issue 3 years ago • 1 comments

"vue": "^2.6.11" "sortablejs": "^1.15.0",

当我对拖拽列使用了固定属性,则无法拖拽。麻烦看看怎么修复一下?谢谢 Drag has no effect when fixed columns are used. thanks! <el-table-column width="50" fixed="left"> <p class="sort"><i class="el-icon-tz"></i></p> </el-table-column>

Gemini-0529 avatar Aug 22 '22 01:08 Gemini-0529

要解决这个问题,就要先讲一下el-table的fixed属性,加了这个属性,他会将表格拆分成2、3个单独的表格,没有fixed属性的列集合是一个表格,有相同fixed列属性值的列集合是另外一个、两个表格。比如我们只写了fixed="left",则左侧会生成一个新的表格,如果我们又写了fixed="right",则右侧也会生成一个新表格。 如果我们绑定在fixed列上,那么其实是绑在未设置fixed属性列集合的那个表格上面了,而那个表格其实是在新表格的后面,被遮住或隐藏了,这块具体的我没注意去看,大概反正就是这样子。 所以我们绑定的时候,如果设置在fixed列上,就要修改一下绑定时的对象

比如原本没加fixed时,我写的代码是这样子: const el = document.querySelectorAll('.dragHeaderTable')[0]

那么加了fixed属性后,代码可能就应该是这样: const el = document.querySelectorAll('.dragHeaderTable')[1]

0 是原本的表格,1是新生成的有fixed属性的那个表格。

大体上是这么个思路,解决方法自己琢磨吧,我反正水平是很菜的,也懒得琢磨,暂时我是这样解决的。

heirui2022 avatar Apr 05 '24 12:04 heirui2022