模式后：“历史”vue 路由器不起作用

Question

我最近开始学习 vuejs，并使用 firebase 构建和应用以进行身份​​验证。 安装 webpack 主题并尝试删除链接上的默认主题标签后出现问题。当我插入mode:history 时，它不会在我登录到我的 hello 页面后重定向我。当我删除它时，一切正常。

我的 index.js（在我的 router 文件夹下）：

Vue.use(Router)

const router = new Router({
  mode: 'history',
  routes: [
    {
      path: '*',
      redirect: '/login'
    },
    {
      path: '/',
      redirect: '/login'
    },
    {
      path: '/login',
      name: 'Login',
      component: Login
    },
    {
      path: '/sign-up',
      name: 'SignUp',
      component: SignUp
    },
    {
      path: '/hello',
      name: 'Hello',
      component: Hello,
      meta: {
        requiresAuth: true
      }
    }
  ]
})

router.beforeEach((to, from, next) => {
  let currentUser = firebase.auth().currentUser;
  let requiresAuth = to.matched.some(record => record.meta.requiresAuth);

  if (requiresAuth && !currentUser) next('login')
  else if (!requiresAuth && currentUser) next('hello')
  else next()
})

export default router

这是我的登录按钮示例：

<button class="btn" type="submit" v-on:click="signIn">Log In</button>

还有我的组件脚本：

<script>
  import firebase from 'firebase'

  export default {
    name: 'login',
    data: function() {
      return {
        email: '',
        password: ''
      }
    },
    methods: {
      signIn: function() {
        firebase.auth().signInWithEmailAndPassword(this.email, this.password).then(
          (user) => {
            this.$router.replace('hello')
          },
          (err) => {
            alert('Oops. ' + err.message)
          }
        );
      }
    }
  }
</script>

这和v-on:click函数有关系吗？

如果您需要其他任何东西来解决我的问题，请告诉我。

Answer 1

案件很重要！

替换

this.$router.replace('hello')

与

this.$router.replace('Hello')

也替换

next('login')

与

next('/login')

或

next('Login')