Question

如何使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商店

中的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上仍然显示页面

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

Answer 1

据我了解，在发送到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 个答案: