a-tree傳送父id及回顯後父id的子節點會全選中,預設展開等問題的解決辦法
阿新 • • 發佈:2020-11-18
<a-tree
v-model="checkedKeys"
:replaceFields="replaceFields"
checkable
:expanded-keys="expandedKeys"
:auto-expand-parent="autoExpandParent"
:selected-keys="selectedKeys"
:tree-data="menuTreeData"
@expand="onExpand"
@select="onSelect"
@check="onCheck"
ref="tree"
methods: {
onExpand(expandedKeys) {this.expandedKeys = expandedKeys this.autoExpandParent = false }, onCheck(checkedKeys, info) { this.parentNode = info.halfCheckedKeys this.menuids = checkedKeys this.checkedKeys = checkedKeys }, onSelect(selectedKeys, info) { this.selectedKeys = selectedKeys }//地獄回撥
getTreeChildren(data) { data && data.map((item) => { if (item.children && item.children.length > 0) { this.getTreeChildren(item.children) // console.log("這些是父") } else { // console.log("這些是子") this.newArr.push(item.menuId) } return null }) return this.newArr }, edit(record) { getRole(pick(record, ['roleId'])).then((res) => { this.subsystemId = res.rows[0].subsystemId this.checkedKeys = res.rows[0].menuIds // this.checkedKeys = res的減去parent的 得出[子id] let params = {} params.subsystemId = this.subsystemId getListsubsystom(params.subsystemId).then((res) => { this.menuTreeData = res.data var str = this.getTreeChildren(this.menuTreeData) var arr=[] for (var i = 0; i < this.checkedKeys.length; i++) { var found = str.indexOf(this.checkedKeys[i]) console.log(found) if(found!=-1){ arr.push(this.checkedKeys[i]) } } this.expandedKeys=arr this.autoExpandParent = true this.checkedKeys=arr }) }) }
第一段第二段相信大家可以看懂,第三段程式碼是我根據
params.subsystemId
請求的資料,然後對資料進行了地獄回撥,把id全拿出來,判斷它的children,沒有的話全拿出來,這些就是子節點,然後用這些子節點去查詢請求過來的那幾個id,找到了就push到陣列中,這個陣列賦值給checkedKeys這個就好了,
this.expandedKeys=arr這是用來控制初始預設展開的資料
this.autoExpandParent = true使用開解決預設展開的資料不能關閉的問題