elementui table 默认勾选

最新推荐文章于 2025-10-17 18:03:10 发布

原创最新推荐文章于 2025-10-17 18:03:10 发布 · 1.7k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue

vue 专栏收录该内容

4 篇文章

订阅专栏

本文介绍如何在Vue框架中使用Element UI的El-Table组件，并实现表格数据行的预选中功能。通过设置ref属性和利用$nextTick方法，可以实现在页面加载时根据特定条件自动选中表格中的某一行。

html table

<el-table :stripe="true" style="width: 100%" border highlight-current-row
                  ref="table"
                  :data="tableData"
                  row-key="id">
</el-table>

PS:注意 ref=“table” 配置不加这个在vue中会找不到这个组件

vue

//为了防止指向错误 所以我都是直接提出来的
let self=this;
$.each(vm.tableData, function (index, item) {
	//这里可以用你的条件
    if (item.state == "0") {
             //默认选中
             self.$nextTick(function () {
                 self.$refs.table.toggleRowSelection(item, true);
             })
     }
})

如果有更好的解决办法请留言