iview treeコンポーネントchecked,expand,indeterminate値がレンダリングされない問題の修正
6730 ワード
最初のtree型データを構築する際にcheckなど3つの値を付与していませんでしたが、tree型データを取得したときに付与しようと思ったので、最初のツリー構造の場合↓
その後、データを取得してtreeを描画するときにcheckなどに値を付与するとクリックチェックが表示されますが、treeがレンダリングされないという問題があります.親のexpandをクリックして、オフにしてからレンダリングに成功します↓以下はtree付与です
解決策は、treeを最初に描画したときにcheckなどの属性を追加するか(↓コード参照)、データを取得してcheck属性を付与するときにオブジェクトのsetメソッドを使用して付与するか、原理はあまり言わないが、興味のあるオブジェクトのsetメソッドを参照することができる
let obj = {
title: '',
MENU_ID: '',
children: [{
title: '',
MENU_ID: '',
children: []
}]
}
その後、データを取得してtreeを描画するときにcheckなどに値を付与するとクリックチェックが表示されますが、treeがレンダリングされないという問題があります.親のexpandをクリックして、オフにしてからレンダリングに成功します↓以下はtree付与です
tree.forEach((el, index) => {
tree[index].checked = false
tree[index].indeterminate = false
tree[index].expand = false
if (el.children) {
this.checkTree(el.children, data)
} else {
data.forEach(item => {
if (el.MENU_ID === item.MENU_ID) {
tree[index].checked = true
}
})
}
});
解決策は、treeを最初に描画したときにcheckなどの属性を追加するか(↓コード参照)、データを取得してcheck属性を付与するときにオブジェクトのsetメソッドを使用して付与するか、原理はあまり言わないが、興味のあるオブジェクトのsetメソッドを参照することができる
let obj = {
title: '',
checked:false,
indeterminate:false,
expand: false,
MENU_ID: '',
children: [ {
title: '',
checked:false,
indeterminate:false,
expand: false,
MENU_ID: '',
children: []
}]
}