Set the default selected node through the default-checked-keys property of the tree tree control
<el-form-item label="Role Permissions:"> <el-tree :data="data2" show-checkbox node-key="id" @check="handleNodeClick" :default-expanded-keys="[]" ref="tree" :default-checked-keys="default_select" :props="defaultProps"> </el-tree> </el-form-item>
data() { return { data2: [], defaultProps: { children: 'child', label: 'name' }, menu_ids: [], // Select by default default_select: [], role_id: 0, } }, methods: { /** * Get details */ getDetail() { let that = this; that.$(.api_url + "/Role/show_edit", { token: , role_id: that.role_id }, { emulateJSON: true }).then( function (res) { var data = ; if (data) { = ; = ; = (); /**Focus start*/ if(typeof (data.menu_id) == 'object'){ //Return to array data.menu_id = (data.menu_id).map(key=> data.menu_id[key]); } //Assignment data.menu_id.forEach((value)=>{ that.default_select.push(value); }); setTimeout(function () { that.default_select.forEach((value)=>{ that.$(value,true,false) }); },100); that.menu_ids = data.menu_id; /**The key end*/ } }); }, /** * Attribute control */ handleNodeClick(e, data) { (data); (e); this.menu_ids = }, }
In summary, the Tree tree control obtains the array data through the background interface, and needs to traverse it again and traverse it into an array, so that we can call it. If we directly get the array from the background and call it, we cannot get the content in this array.
The above is all the content of this article. I hope it will be helpful to everyone's study and I hope everyone will support me more.