axios 响应拦截器 当获取后端状态码为401时跳转到登录页面但router.push(‘/login‘)报push错误的解决方法

src/router/index.js中的内容import{createRouter,createWebHistory,useRouter}fromvue-routerimportHomeViewfrom/views/HomeView.vue;importLoginPagefrom/views/LoginPage.vue;import{useUserStore}from/stores/userStore.jsconstroutes[{path:/,name:Home,component:HomeView,},{path:/login,name:Login,component:LoginPage}];constroutercreateRouter({history:createWebHistory(),routes});router.beforeEach((to,from,next){constuserStoreuseUserStore()// console.log(to,to)if(to.nameLogin){if(userStore.userInfo.token!null){userStore.clearUserInfo()router.push(/login)}}else{// console.log(userStore.userInfo.token, userStore.userInfo.token)if(userStore.userInfo.tokennull){router.push(/login)}}next()});exportdefaultrouter;src/utils/requests.js中的内容importaxiosfromaxios;import{ElMessage}fromelement-plus;import{useUserStore}from/stores/userStore.js;// import {useRouter} from vue-router;importrouterfrom/routerconsthttpInstanceaxios.create({// baseURL: http://127.0.0.1:8000,baseURL:,// timeout:5000})httpInstance.interceptors.request.use(config{constuserStoreuseUserStore()consttokenuserStore.userInfo.tokenif(token){config.headers.AuthorizationBearer${token}}returnconfig},ePromise.reject(e))import{useRouter}fromvue-router;httpInstance.interceptors.response.use(resres.data,e{console.log(response_error,e)console.log(typeofe.status)// const router useRouter()if(e.status401){console.log(进来没)// window.location.href /login// router.push(/login)router.push(/login)}// router.push(/login)// 出错了统一回复ElMessage({type:error,// message: e.response.data.messagemessage:e.message,duration:5000})// console.log(e, e)returnPromise.reject(e)})exportdefaulthttpInstance如果window.location.href ‘/login’进行页面跳转则用哪种router形式都可以如果要用router.push(’/login’) 这种方式则在响应拦截器中必须用import router from /router’这种方式进行导入这种方式导入import {useRouter} from ‘vue-router’; 在响应拦截器中会报push出错。