我有一個物件“info_login”，我可以在其中獲取帳戶資訊：
async created() {
try {
const res = await axios.get(inscriptionURL);
this.comptes = res.data;
this.comptes.forEach(element => {
const data = {'pseudo': element.pseudo, 'password': element.password};
this.info_login.push(data)
});
} catch (e) {
console.error(e);
}
},
我明白了：
info_login: [
{pseudo: Nifoo, password: koko},
{pseudo: CassyDie, password: azeaze},
]
我的 HTML：
<div class="champs">
<label for="pseudo">Pseudo</label>
<input v-model="pseudo" placeholder="Pseudo" />
</div>
<div class="champs">
<label for="password">Mot de passe</label>
<input type="password" v-model="password" placeholder="Mot de passe" />
</div>
只有當我在昵稱欄位中輸入的昵稱和密碼欄位中輸入的密碼正確時，我才想在控制臺中顯示一個單詞。
目前我有這個：
checkPseudo(info) {
return info.pseudo === this.pseudo;
},
checkPassword(info) {
return info.password === this.password;
},
login() {
console.log(this.info_login.find(element => element.pseudo === this.pseudo))
if (this.info_login.find(this.checkPseudo) && this.info_login.find(this.checkPassword)) {
console.log('OK OK OK OK OK');
} else {
console.log('NOOOOOOOON');
}
}
但問題是當我寫 Nifoo 作為用戶名和 azeaze 作為密碼時，控制臺回傳我 OK OK OK OK OK。
我想將昵稱鏈接到密碼。謝謝你的幫助。
uj5u.com熱心網友回復：
您還需要為密碼添加條件：
new Vue({
el: "#demo",
data() {
return {
pseudo: '',
password: '',
info_login: [
{pseudo: 'Nifoo', password: 'koko'},
{pseudo: 'CassyDie', password: 'azeaze'},
]
}
},
methods: {
checkPseudo(info) {
return info.pseudo === this.pseudo;
},
checkPassword(info) {
return info.password === this.password;
},
login() {
if (this.info_login.find(element => element.pseudo === this.pseudo && element.password === this.password)) {
console.log('OK');
} else {
console.log('NOOOOOOOON');
}
}
}
})<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="demo">
<div class="champs">
<label for="pseudo">Pseudo</label>
<input v-model="pseudo" placeholder="Pseudo" />
</div>
<div class="champs">
<label for="password">Mot de passe</label>
<input type="password" v-model="password" placeholder="Mot de passe" />
</div>
<button @click="login">login</button>
</div>轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/414176.html
標籤：
上一篇：v-slot添加新列名