How to watch computed vee-validate errors?
up vote
3
down vote
favorite
I have vee-validate validating an input field. Every time an invalidation error occurs in the input field, I would like for an event to be emitted.
I thought it best, therefore, to just created a computed field that represents the $validator.errors.
The issue is that the the $emit event in watch never gets fired.
My code is as such:
<template>
<input
type="number"
name="quantity"
v-validate="{
max_value: 50
}" />
</template>
<script>
export default {
data () {
return {}
},
computed: {
formErrors () {
const errors = this.$validator.errors;
return errors;
},
},
watch: {
formErrors (value) {
return this.$emit('form-errors', value)
}
}
}
</script>
vue.js vee-validate
asked Aug 21 at 8:46
Modermo
513314
add a comment |
up vote
3
down vote
favorite
I have vee-validate validating an input field. Every time an invalidation error occurs in the input field, I would like for an event to be emitted.
I thought it best, therefore, to just created a computed field that represents the $validator.errors.
The issue is that the the $emit event in watch never gets fired.
My code is as such:
<template>
<input
type="number"
name="quantity"
v-validate="{
max_value: 50
}" />
</template>
<script>
export default {
data () {
return {}
},
computed: {
formErrors () {
const errors = this.$validator.errors;
return errors;
},
},
watch: {
formErrors (value) {
return this.$emit('form-errors', value)
}
}
}
</script>
vue.js vee-validate
asked Aug 21 at 8:46
Modermo
513314
add a comment |
up vote
3
down vote
favorite
up vote
3
down vote
favorite
I have vee-validate validating an input field. Every time an invalidation error occurs in the input field, I would like for an event to be emitted.
I thought it best, therefore, to just created a computed field that represents the $validator.errors.
The issue is that the the $emit event in watch never gets fired.
My code is as such:
<template>
<input
type="number"
name="quantity"
v-validate="{
max_value: 50
}" />
</template>
<script>
export default {
data () {
return {}
},
computed: {
formErrors () {
const errors = this.$validator.errors;
return errors;
},
},
watch: {
formErrors (value) {
return this.$emit('form-errors', value)
}
}
}
</script>
vue.js vee-validate
asked Aug 21 at 8:46
Modermo
513314
I have vee-validate validating an input field. Every time an invalidation error occurs in the input field, I would like for an event to be emitted.
I thought it best, therefore, to just created a computed field that represents the $validator.errors.
The issue is that the the $emit event in watch never gets fired.
My code is as such:
<template>
<input
type="number"
name="quantity"
v-validate="{
max_value: 50
}" />
</template>
<script>
export default {
data () {
return {}
},
computed: {
formErrors () {
const errors = this.$validator.errors;
return errors;
},
},
watch: {
formErrors (value) {
return this.$emit('form-errors', value)
}
}
}
</script>
vue.js vee-validate
vue.js vee-validate
asked Aug 21 at 8:46
Modermo
513314
asked Aug 21 at 8:46
Modermo
513314
asked Aug 21 at 8:46
Modermo
513314
asked Aug 21 at 8:46
Modermo
513314
asked Aug 21 at 8:46
Modermo
513314
513314
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
up vote
5
down vote
accepted
Ok, after a tiny bit more research, this is a simple fix.
formErrors : {
handler (value) {
return this.$emit('form-errors', value)
},
deep:true
}
You need to deep watch the handler.
edited Nov 19 at 11:12
E_net4 is kind and welcoming
11.2k63468
answered Aug 21 at 8:50
Modermo
513314
add a comment |
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
up vote
5
down vote
accepted
Ok, after a tiny bit more research, this is a simple fix.
formErrors : {
handler (value) {
return this.$emit('form-errors', value)
},
deep:true
}
You need to deep watch the handler.
edited Nov 19 at 11:12
E_net4 is kind and welcoming
11.2k63468
answered Aug 21 at 8:50
Modermo
513314
add a comment |
up vote
5
down vote
accepted
Ok, after a tiny bit more research, this is a simple fix.
formErrors : {
handler (value) {
return this.$emit('form-errors', value)
},
deep:true
}
You need to deep watch the handler.
edited Nov 19 at 11:12
E_net4 is kind and welcoming
11.2k63468
answered Aug 21 at 8:50
Modermo
513314
add a comment |
up vote
5
down vote
accepted
up vote
5
down vote
accepted
Ok, after a tiny bit more research, this is a simple fix.
formErrors : {
handler (value) {
return this.$emit('form-errors', value)
},
deep:true
}
You need to deep watch the handler.
edited Nov 19 at 11:12
E_net4 is kind and welcoming
11.2k63468
answered Aug 21 at 8:50
Modermo
513314
Ok, after a tiny bit more research, this is a simple fix.
formErrors : {
handler (value) {
return this.$emit('form-errors', value)
},
deep:true
}
You need to deep watch the handler.
edited Nov 19 at 11:12
E_net4 is kind and welcoming
11.2k63468
answered Aug 21 at 8:50
Modermo
513314
edited Nov 19 at 11:12
E_net4 is kind and welcoming
11.2k63468
edited Nov 19 at 11:12
E_net4 is kind and welcoming
11.2k63468
edited Nov 19 at 11:12
E_net4 is kind and welcoming
11.2k63468
11.2k63468
answered Aug 21 at 8:50
Modermo
513314
answered Aug 21 at 8:50
Modermo
513314
answered Aug 21 at 8:50
Modermo
513314
513314
add a comment |
add a comment |
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f51944897%2fhow-to-watch-computed-vee-validate-errors%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
