I wanted to make a validation on the match of passwords with the following error:
vue.runtime.esm.js?2b0e:619 [Vue warn]: Property or method “$v” is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See: https://v2.vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties.
main.js
JavaScript
x
15
15
1
import Vue from 'vue';
2
import Vuelidate from 'vuelidate';
3
import VueTheMask from 'vue-the-mask';
4
5
Vue.use(Vuelidate, VueTheMask);
6
7
Vue.config.productionTip = false;
8
9
new Vue({
10
router,
11
store,
12
vuetify,
13
render: h => h(App)
14
}).$mount('#app')
15
My form
JavaScript
1
54
54
1
2
3
<form action="#" method="GET" @submit.prevent="pswResetHendler">
4
<label class="input__label" for="psw">Yangi parolni kiriting</label>
5
<input
6
class="input input__psw"
7
type="password"
8
name="psw"
9
required
10
v-model="password"
11
:class="{ 'is-invalid': $v.password.$error }"
12
/>
13
<label class="input__label" for="psw">Yangi parolni qayta kiriting</label>
14
<input
15
class="input input__psw"
16
type="password"
17
name="psw"
18
v-model="confirmPassword"
19
:class="{ 'is-invalid': $v.confirmPassword.$error }"
20
/>
21
<span
22
class="input__error match-error"
23
v-if="!$v.confirmPassword.sameAsPassword"
24
>Kiritilgan parollar bir xil bo’lishi lozim, Qayta urinib ko’ring!</span
25
>
26
<button class="login-btn" type="submit">KIRISH</button>
27
</form>
28
29
30
<script>
31
import { sameAs } from "vuelidate/lib/validators";
32
export default {
33
name: "password-reset",
34
data() {
35
return {
36
password: "",
37
confirmPassword: "",
38
};
39
},
40
methods: {
41
pswResetHendler() {
42
this.$v.$touch();
43
if (this.$v.$invalid) {
44
return;
45
}
46
this.$router.push("/");
47
},
48
},
49
validation: {
50
confirmPassword: { sameAsPassword: sameAs("password") },
51
},
52
};
53
</script>
54
Please help me guys I can’t solve this for a day ((((
Advertisement
Answer
I’m really sorry guys )
I wrote the property validations
incorrectly. I wrote
JavaScript
1
4
1
validation: {
2
confirmPassword: { sameAsPassword: sameAs("password") },
3
},
4
instead of this I had to write
JavaScript
1
4
1
validations: {
2
confirmPassword: { sameAsPassword: sameAs("password") },
3
},
4