En mi archivo Login.vue, tengo la función de inicio de sesión. Cuando hago clic en el botón de inicio de sesión, se vuelve a cargar dos veces en el diseño de inicio de sesión antes de redirigir la ruta al diseño de checkin . Así que debo hacer clic dos veces en el botón de inicio de sesión

Este es mi video sobre este error.

https://youtu.be/t5OHtqjgT54

 // Login.vue <template> <CButton @click="onLogin()"> Login </CButton> </template> <script> const onLogin = async () => { const { data } = await axios.post('/login', data) window.localStorage.setItem('user-info', JSON.stringify(data.user)) router.push('/manager/checkin') } </script>

En mi enrutador.js

 // router/index.js const routes = [ { path: '/', component: DefaultLayout, redirect: '/manager/checkin', children: [ { path: '/manager/checkin', component: () => import('@/views/manager/Checkin.vue'), }, ], }, { path: '/pages', redirect: '/pages/404', component: { render() { return h(resolveComponent('router-view')) }, }, children: [ { path: 'login', component: () => import('@/views/pages/Login.vue'), }, ], }, ] const router = createRouter({ history: createWebHashHistory(process.env.BASE_URL), routes, }) router.beforeEach((to, from, next) => { const publicPages = ['/pages/login'] const authRequired = !publicPages.includes(to.path) const loggedIn = localStorage.getItem('user-info') if (authRequired && !loggedIn) { next('/pages/login') } else { next() } }) export default router