在用户身份验证中, 我试图更改主页显示,并显示“欢迎用户”和“注销”
我的问题是v-if
的值不会随router.push更改。我必须刷新页面才能显示此块
<template>
<div>
<form class="login" @submit.prevent="login">
<h1>Sign in</h1>
<label>Email</label>
<input required v-model="email" type="email" placeholder="Name"/>
<label>Password</label>
<input required v-model="password" type="password" placeholder="Password"/>
<hr/>
<button type="submit">Login</button>
</form>
</div>
</template>
<script>
export default {
data(){
return {
email : "",
password : ""
}
},
methods: {
login: function () {
let email = this.email
let password = this.password
this.$store.dispatch('login', { email, password })
.then(() => this.$router.push('/'))
.catch(err => console.log(err))
}
}
}
</script>
和app.vue: 模板:
<span v-if="isLoggedIn"> {{user.email}} </span>
<span v-if="isLoggedIn"> | <a @click="logout">Logout</a></span>
在脚本中
computed : {
isLoggedIn : function(){ return this.$store.getters.isLoggedIn}
}