重新渲染Vue路线_JavaScript

如何使VUE重新渲染路线

考虑我有login.vue文件（故意不添加模板内容，因为它不会发布）

import { auth_url, home_url} from "./../config/url.js"


export default {
    name: "login",
    data () { 
       return {
        auth_url: auth_url
       } 
    },
  created: function() {
      console.log(home_url)
    return this.$store.dispatch("GOOGLE_PROFILE",  home_url)
    }
}

这里

return this.$store.dispatch("GOOGLE_PROFILE",  home_url)

调度一个动作，该动作将被切断并检查用户是否已通过身份验证。 如果用户已通过身份验证，它将更新状态并在Vuex Store中更改isAuthenticated: true

现在，我在进行客户端身份验证的Vue路由中

export default function (vuexStore) {
 let {store} = vuexStore

 const ifAuthenticated = (to, from, next) => {
   console.log("Inside If Authenticated", store.getters.GET_USER_AUTHENTICATION)
  if (store.getters.GET_USER_AUTHENTICATION) return next()
  else  next('/login')
 }

 const ifNotAuthenticated = (to, from, next) => {
  if (!store.getters.GET_USER_AUTHENTICATION)  return next()
  else  next('/')
}

  const Router = new VueRouter({
    mode: 'history', 
    routes : [
      {
        path: '/',
        beforeEnter: ifAuthenticated,
        component: () => {
          return  import('./../container/Index.vue')
        }
      }, 
      {
        path: '/login',
        beforeEnter: ifNotAuthenticated,
        component: () => {
         return import('./../container/logn.vue')
        }
      }
    ],
 mode: process.env.VUE_ROUTER_MODE,
    base: process.env.VUE_ROUTER_BASE
  })

现在，问题出在组件呈现之前在我的login.vue中，我想查看用户是否已通过身份验证，如果是，则它将被重定向到“ /”

这么说吧this.$store.dispatch("GOOGLE_PROFILE", home_url)将GET_USER_AUTHENTICATION更改为true，但是我看不到将渲染组件定向为“ /”，而是在我的login.vue页面上仍然显示

有人可以帮我弄清楚我可能做错了什么吗？

据我了解，在调度到GOOGLE_PROFILE操作以检查用户是否通过身份验证之后，您可以使用router.push()将用户重定向到/

您的操作文件：

import router from './router' // import your router


//action
'GOOGLE_PROFILE' ({commit}, payload) {
  checkIfUserIsLogin().then(isLoggedIn => {
    if (isLoggedIn) {
      router.push('/')
    }
  })
}

重新渲染Vue路线

问题描述

1楼