最近在研究el-admin,角色管理里面有个功能是点击左侧的表格里面的一个角色,右侧的树就会自动初始化。
于是我在点击的方法里面,去后台异步调用了一下接口,然后返回数据并把数据赋值给menuIds,但是我发现这个异步请求获取到的数据压根就不能让树控件刷新。
代码如下,我是在handleCurrentChange里面操作的,网上说通过push方法能够起作用,但是根本没用,最后我的解决方法如下,先将ids都存储起来,然后再在nextTick方法里面去给menuIds赋值。
async initMenus(val) {
this.menuIds = []
const AV = window.AV
const role = AV.Object.createWithoutData('Role', val.objectId);
const roleMenuQuery = new AV.Query('RoleMenu');
roleMenuQuery.equalTo("role", role)
roleMenuQuery.include("menu")
var roleMenus = await roleMenuQuery.find()
var ids = [];
roleMenus.forEach(roleMenu => {
var roleMenuJson = roleMenu.toJSON()
ids.push(roleMenuJson.menu.menuId)
})
this.$nextTick(() => {
this.menuIds = ids;
})
// https://blog.csdn.net/xudalin/article/details/103158941
// 这个代码解决了树控件的半选问题。参考链接如上
/*ids.forEach((i, n) => {
var node = this.$refs.menu.getNode(i);
console.log(node.isLeaf)
if (node.isLeaf) {
this.$refs.menu.setChecked(node, true);
}
});*/
},
// 触发单选
handleCurrentChange(val) {
console.log("handleCurrentChange")
if (val) {
const _this = this
// 清空菜单的选中
this.$refs.menu.setCheckedKeys([])
// 保存当前的角色id
this.currentId = val.id
// this.showButton = this.level <= val.level
// 初始化
this.initMenus(val)
// 菜单数据需要特殊处理
/*val.menus.forEach(function (data, index) {
_this.menuIds.push(data.id)
})*/
}
},