老师这里为啥不把tableData置为空,table不刷新呢?

Question

Answer 1

OrcXiao 2023-02-10 11:36:45

如果不设置 tableData = []。
仔细观察之后可以发现 table 并不是没有刷新，只是排名没有刷新。
因为页面通过排序改变顺序之后，tableData 源数据顺序的并没有改变。vue是通过对比新旧源数据diff来更新渲染的。element-plus默认使用index作为:key。所以key的值永远不会改变。diff算法对比更新时，key值不变，vue不会更新组件，只会替换组件的属性值。
设置 row-key = "_id" 便可解决此 bug 。

Answer 2

Sunday 2021-12-14 17:27:07

你好

这个应该是 element-plus 的问题，它无法处理这种问题。所以我们需要手动的激活它的处理选项（响应式功能）

• qq_Simpleisbeau_0 #1

  老师我觉得是跟element-plus的<el-table />的:key有关，它应该默认使用了v-for 的index作为:key。我试了一下添加了【row-key = "_id"】，就不用再重新把tableData.value = [] 设置为空了，拖放的时候，排序也没出现乱序，也自然刷新了。

• Sunday 回复 qq_Simpleisbeau_0 #2

  有可能类似于 node_Key 的机制