解决方式:
在u-table中引入el-table中的el-table-column,修改el-table-column为u-table-column
页面报错
vue.runtime.esm.js:619 [Vue warn]: Duplicate keys detected: 'el-table_1_column_1'. This may cause an update error.
found in
---> <ElTableHeader>
<ElTable> at packages/table/src/table.vue
<UTable> at packages/u-table/src/u-table.vue
<ElCard> at packages/card/src/main.vue
<SvgIcon> at src\xxxx\yyyy\ddddd.vue
<SelfDelivery> at src\views\oooooclient\ppppp\sssss\fffffff.vue
<AppMain> at src\views\layout\components\AppMain.vue
<Layout> at src\views\layout\Layout.vue
<App> at src\App.vue
<Root>
原因:
1、由于之前使用的是el-table,它对大数据量的查询支持性不是很卡,页面经常卡住,后面经过技术选型,使用了u-table,在当时使用中未发现问题。后续由于业务需求在上面进行扩展后出现上述问题。
问题分析和解决思路:
1、通过报错信息分析是由于主键重复的问题,但是当前页面的主键是没有重复的,所以通过报错分析处理问题失败。
2、网上查找帖子和各种博客,统一的回复都是主键重复等等,处理方式是重新设置不重复的主键,通过网上查找问题失败。
3、询问公司前端高手,给出的回复是重复调用了一些东西导致的问题,具体原因需要排查,(由于不是一个项目组,前端没有源码只是看了报错信息分析出来的),所以寻求公司内部帮助失败。
4、加入官方交流群,发送错误信息,回复是多看看源码,是虚拟表格的问题。(本人后端对vue源码全瞎,完全看不懂。)此方式处理失败。
5、后续通过还原代码(不报错的版本),慢慢扩展后发现问题,前端在添加扩展的时候,在u-table中引入el-table中的el-table-column导致报错,修改el-table-column 为u-table-column,报错问题修复,页面不会卡死。