el-table复选框全部勾选以及勾选回显

简介: el-table复选框全部勾选以及勾选回显

el-table复选框全部勾选以及勾选回显

根据后端回显效果

image.png

复选框全选

<el-table ref="multipleTable"></el-table>
AI 代码解读
this.$refs.multipleTable.toggleAllSelection();
AI 代码解读

复选框回显

const {
   
    data } = await getTableData()
data.forEach(item => {
   
   
   if(item.isSelect){
   
     //     根据后端返回是否勾选的字段判断是否勾选
     this.$refs.multipleTable.toggleRowSelection(item)
   }
})
AI 代码解读

如果回显无效,就添加$nextTick

const {
   
    data } = await getTableData()  // data是tebla的数据
data.forEach(item => {
   
   
   if(item.isSelect){
   
     //     根据后端返回是否勾选的字段判断是否勾选
     this.$nextTick(() => {
   
   
         this.$refs.multipleTable.toggleRowSelection(item)
     })
   }
})
AI 代码解读

参考

目录
打赏
0
0
0
0
19
分享
相关文章
|
10月前
|
解决elementUI弹出框关闭后再打开el-select下拉框无法选中的问题
解决elementUI弹出框关闭后再打开el-select下拉框无法选中的问题
224 0
el-popover 点击取消按钮,弹窗仍然无法关闭
el-popover 点击取消按钮,弹窗仍然无法关闭
复选框的全选和取消
该博客文章提供了HTML和JavaScript代码实现复选框的全选和取消全选功能,并展示了测试结果的截图。
复选框的全选和取消
|
8月前
Element UI 多选表格--判断勾选数据行的 Checkbox 时为选中还是取消选中
Element UI 多选表格--判断勾选数据行的 Checkbox 时为选中还是取消选中
126 1
|
10月前
el-cascader组件实现点击、递归勾选联动子集children所有选项被选中。
el-cascader组件实现点击、递归勾选联动子集children所有选项被选中。
odoo wizard界面显示带复选框列表及勾选数据获取
odoo wizard界面显示带复选框列表及勾选数据获取
354 1
【mpvue】radio-group 标签组设置默认选择checked: 'true',选择了单选按钮的非默认选项,再点击其他的选择,单选按钮又会变成默认的选项
1、问题举例描述: radio-group 标签组设置默认选择checked: ‘true’,选择了单选按钮的非默认选项(场外),再点击其他的选择(手续费率),单选按钮又会变成默认的选项(场内) 默认状态如下:
574 0
【mpvue】radio-group 标签组设置默认选择checked: 'true',选择了单选按钮的非默认选项,再点击其他的选择,单选按钮又会变成默认的选项
【Layui】对于列表页复选框只有选中时才会显示
【Layui】对于列表页复选框只有选中时才会显示
191 0
【Layui】对于列表页复选框只有选中时才会显示
【Layui】关于单选框的选中状态,下拉框默认显示
【Layui】关于单选框的选中状态,下拉框默认显示
673 0
【Layui】关于单选框的选中状态,下拉框默认显示
AI助理

你好,我是AI助理

可以解答问题、推荐解决方案等