Vue学习-组件之间跳转，右侧页面刷新，但左侧菜单栏选中状态未刷新

解决前图片:

解决方法: 在嵌入菜单的组件中添加路由监听

select(m){
   this.menuList.forEach(element => {
     if(element.children.length > 0){
         element.children.forEach(child =>{
           if(child.path == m){
             this.selectMenu = child;
             return;
           }
         })
       }
   });
   this.$router.push(this.selectMenu.path);
   //左侧导航栏菜单选中刷新
   this.childActiveMenu = this.selectMenu.path;
   //第一位必需。整数，规定添加/删除项目的位置，使用负数可从数组结尾处规定位置。
   //第二位必需。要删除的项目数量。如果设置为 0，则不会删除项目。
   //第三位可选。向数组添加的新项目。
   this.breadcrumbData.splice(0,1,this.selectMenu);
 },

watch:{
  // 监听路由变化 处理两个组件之间的相互跳转，右侧页面产生变化，但左侧菜单选中状态未刷新
  $route(to, from) {
    this.select(to.path);
  },
  //处理activeName生效，但是openNames不生效的情况
  //运用Menu的updateopened方法：手动更新展开的子目录，注意要在 $nextTick 里调用。对openNames添加watch：
  parentActiveMenu() {
    this.$nextTick(() => {
      this.$refs.side_menu.updateOpened();
      this.$refs.side_menu.updateActiveName();
    })
  },
  //监听菜单数据的变化'$store.state.users.routers' 固定写法
  '$store.state.users.routers':function(){
    this.initMenuData();
  },
}

解决后图片: