el-table复选框显示异常

用vue+element写项目的时候遇到了一个问题,el-table的复选框按钮显示异常,具体表现为:

只选择了一条数据时,上面控制全选的复选框也会呈“全选中”状态,而不是“半选中”状态的只显示一条横线,这样会对用户使用造成干扰。


错误示例
正确示例

查看渲染出来的html,发现element是用class来控制“全选”和“半选中”的,如果是全选,对应的class为“is-checked”,如果是半选中,对应的class为“is-indeterminate”,是这里的判断出了问题,看网上的解决办法是直接forceUpdate,可是我这边不管是假数据还是真实的数据,结构都是一样的,也不是组件间传值的问题,最后发现和表格自带的`row-key`有关,如果这里没有写或者和数据里面的id名称对应不上,就会出现表格复选框渲染错误,改成自己的id就可以解决啦~

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容