<p>我正在使用Vue构建这个小应用程序，但我无法使身份验证工作。确切地说，重定向不起作用，我同时获得了true和Authenticated的日志，但我没有被重定向到主页(/)。但是当我打开应用程序时，我立即被带到/login，这是可以的，我也希望如此，但正如我所说，当我尝试登录时，我没有被重定向。</p> <p>这是我的登录组件和路由器。</p> <pre class="brush:php;toolbar:false;">import { createRouter, createWebHistory } from 'vue-router' import LoginView from '@/views/LoginView.vue' import AboutView from '../views/AboutView.vue'; import isAuthenticated from '@/views/LoginView.vue'; const router = createRouter({ history: createWebHistory(import.meta.env.BASE_URL), routes: [ { path: '/login', name: 'Login', component: LoginView }, { path: '/', name: 'Home', meta: { requiresAuth: true }, component: AboutView, beforeEnter:(to,_,next)=>{ if(to.meta.requiresAuth && !isAuthenticated.value){ next('/login'); } else{ next(); router.push('/'); } } } ] }) export default router</pre> <pre class="brush:php;toolbar:false;"><template> <div> <h2>输入访问令牌以登录</h2> <hr /> <div class="col-md-8"> <section id="loginForm"> <form @submit.prevent="checkAccessToken"> <div class="form-group"> <label><b>访问令牌</b></label> <input v-model="accessToken" type="password" class="form-control" /> </div> <input type="submit" value="登录" class="btn btn-primary" /> </form> </section> </div> </div> </template> <script setup lang="ts"> import { ref} from 'vue' import router from '@/router/index' const isAuthenticated = ref(false); const accessToken = ref(''); const checkAccessToken = () => { if (accessToken.value === '123') { isAuthenticated.value = true; console.log(isAuthenticated.value); console.log('已验证'); router.push('/'); } else { } }; </script></pre> <p><br /></p>

import { useRouter } from 'vue-router'
const router = useRouter();