最近有一个需求就是让用户初始进入页面时使用的areaCode是从用户角色列表里面user字段所对应的areaCode,后面操作了地区选择后切换路由或者是其他操作都不会再切换地址和当前地址的areaCode,因为正常的情况我们一般会在vue的生命周期mouted里面去获取下一用户的角色信息去提前获取areaCode,但是我们一旦切换页面或者切换路由后,再回到这个页面mouted里面获取角色信息的方法又回触发,所以这是我们需要去解决的。所以我想到了用一个标识去识别该方法第一次触发过,后续就不会再触发了。接下来我们就看看代码吧
 // 使用本地存储sessionStorage来存入标识,这样跳转后再回来就不会将标识覆盖,而且使用sessionStorage来存储想比较雨localStorage来说不会有缓存问题,页面关闭标识也就删除了
   let queryCodeDate=sessionStorage.getItem('queryCode')
if(!queryCode){
         // 我目前的业务需求是进入页面获取当前登陆人的角色信息,获取角色里面User的areaCode,但是只需要第一次触发获取
         this.rolesList=this.$store.getters['userInfo/roles'];
         if(this.rolesList&&this.rolesList.length;i++){
                 for(let i=0;i<this.rolesList.length;i++){
                       if(this.rolesList[i].rlTp==='user'){
                           this.areaCode=this.rolesList[i].areaCode
                           break
                       }
                 }
             
         }
         // 处理完前面我们需要的逻辑后,将标识存储在本地这样跳转路由回来就不会被覆盖掉
         sessionStorage.setItem('queryCode',true)
         
    
}else{
         // 当后续再回到这个页面上面的逻辑已被标识,所以不会再触发
         this.areaCode=this.$store.getter['location/areaCode']
}

这就是使用这个逻辑打印出来的输出结果,可以看到多次使用只有第一次触发了if里面的判断,后面再吊用就只会走else里面的逻辑了

在这里插入图片描述

Logo

前往低代码交流专区

更多推荐