Я пишу код для подключения к приложению в vue / quasar / C # Я просто начинаю с vue. И я не понимаю, как действуют правила. Я пишу это, чтобы проверить, что ввод не является пустым для пароля / ConfimPassword
<q-form v-bind:submit="createUser"
v-bind:reset="resetCreateUser"
class="q-gutter-md"
v-if="status==2"
ref="frmCreateUser"
autofocus>
<q-input filled
v-model="loginData.password"
label="Votre mot de passe"
hint="Saisissez votre mot de passe"
v-bind:type="isPwd ? 'password' : ''"
lazy-rules
v-bind:rules="[ val => val && val.length > 0 || 'Saisissez votre mot de passe']"
ref="fldPasswordCreateUser"
data-vv-name="fldPasswordCreateUser">
<template v-slot:append>
<q-icon :name="isPwd ? 'visibility_off' : 'visibility'"
class="cursor-pointer"
v-on:click="isPwd = !isPwd"></q-icon>
</template>
</q-input>
<q-input filled
v-model="loginData.passwordConfirm"
label="Confirmez votre mot de passe"
v-bind:type="isPwd ? 'password' : ''"
lazy-rules
v-bind:rules="[ val => val && val.length > 0 || 'Saisissez votre mot de passe']">
<template v-slot:append>
<q-icon :name="isPwd ? 'visibility_off' : 'visibility'"
class="cursor-pointer"
v-on:click="isPwd = !isPwd"></q-icon>
</template>
</q-input>
...
</q-form>
Я проверяю свой метод if (this.loginData.password == this.loginData.passwordConfirm) {...
Но я хочу изменить свой v-bind: правила и отобразить ошибку как пустое поле и поставить 'Парольне совпадают 'Но у меня всегда есть ошибки sysntaxs ... Спасибо за вашу помощь
ОБНОВЛЕНИЕ
Я пытаюсь
v-bind:rules="[val => val && val.length > 0 || 'saisissez quelque chose :)',val => val != $refs.fldPasswordChange || 'Mots de passe différents']"
Чтобы иметь 2 элемента управления, но кажется, что второй не срабатывает
UPDATE2
Я пробую то, что предлагает Дин
<q-input filled
v-model="loginData.password"
label="Votre mot de passe"
hint="Saisissez votre mot de passe"
v-bind:type="isPwd ? 'password' : ''"
lazy-rules
v-bind:rules="Required"
ref="fldPasswordChange">
<template v-slot:append>
<q-icon :name="isPwd ? 'visibility_off' : 'visibility'"
class="cursor-pointer"
v-on:click="isPwd = !isPwd"></q-icon>
</template>
</q-input>
<q-input filled
v-model="loginData.passwordConfirm"
label="Confirmez votre mot de passe"
v-bind:type="isPwd ? 'password' : ''"
lazy-rules
v-bind:rules="ConfirmPWD"
ref="fldPasswordChangeConfirm">
<template v-slot:append>
<q-icon :name="isPwd ? 'visibility_off' : 'visibility'"
class="cursor-pointer"
v-on:click="isPwd = !isPwd"></q-icon>
</template>
</q-input>
и
computed: {
ConfirmPWD() {
return [
(v) => !!v || "Saisissez quelquechose :-)",
(v) => v != this.$refs.fldPasswordChange.value || "Mots de passe différents"
]
},
Required() {
return [(v) => !!v || 'Saisissez quelque chose :-)']
}
},
Но, похоже, вторые органы управления не срабатывают. Если я не заполняю confimPassword, у меня есть сообщение, но если я поставлю 2 разных пароля, ничего ... Я поставлю точку останова, все значение будет хорошим. Конечно, проблема синтаксиса в моем состоянии .. когда я ставлю
(v) => v != this.$refs.fldPasswordChange.value || "Mots de passe différents"
без (v) => !! v ||"Saisissez quelquechose :-)", нет сообщения об ошибке