使用el-menu-item报错Uncaught TypeError: Cannot use ‘in‘ operator to search for ‘path‘ in null

最开始是这样写的,点击该菜单后,调用logout(),清理localStorage,并路由跳转到/login:

const logout = () =>{
    
    
        store.commit('clearALL');
         router.push('/login');  
      };

...
<el-menu-item @click="logout()"><el-icon><SwitchButton /></el-icon>安全退出</el-menu-item>

结果点击后,一直报错,页面没有反应:
[Vue warn]: Unhandled error during execution of native event handler
runtime-core.esm-bundler.js?ef1b:218 Uncaught TypeError: Cannot use ‘in’ operator to search for ‘path’ in null
在这里插入图片描述
在这里插入图片描述
我在vue2中,也是这样写的,没有报错,正常执行功能,就很疑惑。搜了下网上的方法,createWebHashHistory()也没有写错。

最后,修改为了下面这样,终于调好了。

const logout = () =>{
    
    
        store.commit('clearALL');
      };
      
......
<el-menu-item index="/login" @click="logout()"><el-icon><SwitchButton /></el-icon>安全退出</el-menu-item>

应该是要把路由跳转/login放到el-menu-item的index,不要把路由跳转放到logout方法中。

猜你喜欢

转载自blog.csdn.net/m0_46368082/article/details/126951338
今日推荐