模式：'歷史'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')