дата-вв-как обновление поздно на один шаг после изменения значения?

Question

Я столкнулся с проблемой с data-vv-as в Vee-Validator:

Я создаю приложение с двумя языками (кхмерский и английский), используя Localize и i18n.Когда я нажимаю изменить язык, я не хочу видеть first_name как необходимое сообщение об ошибке.поэтому я использую data-vv-as в качестве имени, а затем хочу, чтобы он переключал как кхмерский, так и английский языки.При обновлении он переводится правильно, но когда я нажимаю кнопку изменить язык в первый раз, он не переводится.

Затем, когда я нажимаю второй раз, он начинает переводить и в результате переводить оба языка.

code

import VueI18n from 'vue-i18n'
import messages from './locales'

Vue.use(VueI18n)

const locale = localStorage.getItem('locale') || 'en'
const i18n = new VueI18n({
    locale: locale, // set locale
    messages, // set locales
})

import VeeValidate, { Validator } from 'vee-validate'
import enValidationMessages from 'vee-validate/dist/locale/en'
import khValidationMessages from 'vee-validate/dist/locale/kh'

Vue.use(VeeValidate,
{
  i18n,
  dictionary: {
    en: enValidationMessages,
    kh: khValidationMessages
  }
})

html-код:

<div class="form-group row ">
    <label for="first_name" class="col-sm-4 col-form-label">{{ $t("label.first_name") }}</label>
    <div class="col-sm-8">
        <input v-model="owner.first_name" v-validate="'required|alpha'" :data-vv-as="$t('label.first_name')"
            v-bind:class="{ 'is-invalid' : errors.has('first_name')}" v-bind:placeholder="$t('label.first_name')" name="first_name"
            id="first_name" type="text" class="form-control" />
        <span class="text-danger mt-4" v-show="errors.has('first_name')">{{ errors.first('first_name') }}</span>
    </div>
</div>

выход