
解绑作为一个悲催的前端实习仔,今天又是卡住的一天。
需求:将左侧菜单项实现点击置顶 *** 作(左侧菜单项有对象数组遍历得出,实质就是将选中的对象提升到数组的第一位)
公司项目使用了element中的NavMenu组件来实现,提升实现很简单,但是提升之后激活状态一直出现问题,卡了大半天。最后还是请教涛哥得到解决。。。。代码不全,仅用于自己个人记录
//点击小图标将当前菜单提示至顶部
toArrayTop(flag, length) {
if (length === 0) { //二级菜单是否存在的判断用于传递以及菜单的值
this.active = flag.toString()
}
this.isUpdate = false; //赋值为假在为真触发页面刷新,避免样式跳动
let topItem = {}
this.leftMenu.forEach((item, index)=> {
if (item.index == flag){
topItem = item;
this.leftMenu.splice(index, 1);
return;
}
})
this.leftMenu.unshift(topItem);//对象提升
this.topButton = '';
//存储当前激活状态,保存当前菜单数组,刷新页面.
localStorage.setItem('caption-type', flag);
this.saveMenuList()
this.$nextTick(() => { //更新页面用于刷新数据
this.isUpdate = true
})
},
我的问题主要出现在,二级选项的激活状态上,需要在选中的回调里自行设置激活状态,而后在提升时进行相关更改,类似下图情形:
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)