table tree checkbox状态下 操作 selectedRowKeys 无效 #8280
Description
问题：在tabelTree设置为checkbox，并给他设置了默认勾选值时，无法通过页面其他按钮来控制checkbox的状态。
环境：window11 google
复现代码：
<script setup> import {ref} from "vue"; const tableDom = ref(null); const columns = [ { title: '权限名称', dataIndex: 'name', key: 'name', width: 200, }, { title: '操作', dataIndex: 'action', key: 'action', width: 200, }, ]; const dataList = ref([ {id:1,name:'权限1',check:false,checkAlls:false,operationList:[],twoList:[ {id:2,name:'操作1',btnCode:'btnCode1',check:false,checkAlls:false,twoList:null,operationList:[],}, {id:3,name:'操作2',btnCode:'btnCode2',check:false,checkAlls:false,twoList:null,operationList:[],}, {id:4,name:'操作3',btnCode:'btnCode2',check:false,checkAlls:false,twoList:null,operationList:[ {id:5,btnName:'操作4',btnCode:'btnCode1',check:false}, {id:6,btnName:'操作5',btnCode:'btnCode2',check:false}, {id:7,btnName:'操作6',btnCode:'btnCode3',check:false}, ]}, ]}, {id:8,name:'权限2',check:false,checkAlls:false,operationList:[],twoList:[ {id:9,name:'操作1',btnCode:'btnCode1',check:false,checkAlls:false,twoList:null,operationList:[],}, {id:10,name:'操作2',btnCode:'btnCode2',check:false,checkAlls:false,twoList:null,operationList:[],}, {id:11,name:'操作3',btnCode:'btnCode2',check:false,checkAlls:false,twoList:null,operationList:[ {id:12,btnName:'操作4',btnCode:'btnCode1',check:false}, {id:13,btnName:'操作5',btnCode:'btnCode2',check:false}, {id:14,btnName:'操作6',btnCode:'btnCode3',check:false} ]} ]} ]); const rowSelection = ref({ checkStrictly: false, selectedRowKeys: [1,3,8,9,11], onChange: (selectedRowKeys, selectedRows) => { rowSelection.value.selectedRowKeys = selectedRowKeys; //console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows); }, onSelect: (record, selected, selectedRows) => { //console.log(record, selected, selectedRows); }, onSelectAll: (selected, selectedRows, changeRows) => { //console.log(selected, selectedRows, changeRows); }, }); const onAllChange = (e,row) =>{ row.checkAlls = e.target.checked; setAllCheck(row.twoList , e.target.checked) } const onItemChange = (e,row) =>{} const setAllCheck = (arr , value) =>{ for (const v of arr) { v.checkAll = value; v.check = value; console.log(v.name,'--',v.id) if(!value){ rowSelection.value.selectedRowKeys = rowSelection.value.selectedRowKeys.filter(item => item !== v.id) }else { const objIndex = rowSelection.value.selectedRowKeys.findIndex(item => item === v.id); if(objIndex < 0){ rowSelection.value.selectedRowKeys.push(v.id) } } console.log( rowSelection.value.selectedRowKeys) if(v.operationList.length){ for(const d of v.operationList){ d.check = value; } }else{ v.twoList && v.twoList.length && setAllCheck(v.twoList , value) } } } </script> 全选
全选
{{ item.btnName}}（{{item.btnCode}}）
<style scoped lang="less">
</style>