After changing the page, I noticed that the errors from the form are still visible. Is there a way to make them disappear when navigating away and only show up if I return to the page?
Here are the errors I am encountering:
<template>
<b-form @submit="onSubmit">
<div v-if="getError">
<div v-for="(_errors, key) in getError">
<b-alert
v-for="error in _errors"
show
variant="danger">
<h2>{{ formatKey(key) }} :</h2>
<li>{{ error }}</li>
</b-alert>
</div>
</div>
This is my JavaScript code:
computed: {
...mapGetters([
'getError'
]),
methods : {
startDate() {
return Date.now()
},
highlightFrom (elem) {
this.validate_start = true
this.disabledDates.to = elem
},
validate (elem){
return elem !== null && elem !== ''
},
setSelected(value) {
this.hiring_contract_category = value;
this.contract = value === 'contract';
},
async onSubmit(event) {
this.errors = false;
this.$store.commit('commit_contractable_id', this.id)
await this.$store.dispatch('create_contract', this.form)
},
formatKey (key) {
return this.$t('vue.' + key.replace('contract_data.', ''))
}