ant-deign-vue的menu遇上vue-router的导航守卫出现的问题

项目中有一个编辑试卷的页面，当用户编辑一半的时候，如果退出该页面，弹出一个提示框，是否保存？
我用的是vue-router的beforeRouteLeave，但是出现了一个问题，当用户点击侧边栏的目录，页面的路由没有改变，但是点击的侧边栏会先高亮，如果用户点击取消，此时的侧边栏定位就会出现错误

image.png

解决方法：
在layout里面的menu组件，把原来点击事件就赋值给selectKey,去掉，加一个watch监听，当前页面的路由是否改变，改变了才去赋值。

        watch:{
              $route(to){
                  this.location(to.path.split('/'))
               }
        },
        methods:{
                    let page=arr[arr.length-1]
                    if(page=='operation'){
                               page=window.location.search.split('&')[0].split('=')[1]
                     }else if(page=='paperEdit'){
                              page=window.location.search.split('&')[0].split('=')[1]
                      }
                   switch(page){
                         case 'certManage' : this.selectedKeys=['1'];this.openKeys=['sub1']
                         break;
                        .......

                  }