element-plus表格选择框使用toggleRowSelection不回显

    nextTick(() => {
        selectData.forEach(row => {
            tableData.value.forEach(item => {
                if (row.id === item.id) {
                    tableRef.value[0].toggleRowSelection(item, true)
                }
            })
        })
    });

用nextTick包一下就好了

  • 12
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
根据提供的引用内容,`toggleRowSelection`函数用于在多选表格中切换行的选中状态。如果回显无效,可能是因为以下原因之一: 1. `toggleRowSelection`函数未正确调用。请确保在正确的位置和正确的方式下调用该函数。 2. 表格数据未正确绑定。请确保表格数据已正确绑定到表格组件上。 3. 表格行的唯一标识符未正确设置。请确保在表格组件中设置了正确的`row-key`属性。 4. 表格行的选中状态未正确绑定。请确保在表格组件中设置了正确的`row-selection`属性。 以下是一个示例代码,演示如何正确使用`toggleRowSelection`函数来切换多选表格中行的选中状态: ```javascript <template> <div> <el-table :data="tableData" :row-key="row => row.id" :row-selection="{ selected: selectedRows, onSelect: handleSelect, onSelectAll: handleSelectAll }" > <el-table-column type="selection"></el-table-column> <el-table-column prop="name" label="Name"></el-table-column> <el-table-column prop="age" label="Age"></el-table-column> </el-table> </div> </template> <script> export default { data() { return { tableData: [ { id: 1, name: 'John', age: 20 }, { id: 2, name: 'Jane', age: 25 }, { id: 3, name: 'Bob', age: 30 } ], selectedRows: [] }; }, methods: { handleSelect(selection, row) { if (selection.length > 0) { this.$refs.multipleTable.toggleRowSelection(row, true); } else { this.$refs.multipleTable.toggleRowSelection(row, false); } }, handleSelectAll(selection) { if (selection.length > 0) { this.tableData.forEach(row => { this.$refs.multipleTable.toggleRowSelection(row, true); }); } else { this.tableData.forEach(row => { this.$refs.multipleTable.toggleRowSelection(row, false); }); } } } }; </script> ```

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值