Блог

Главная - Вопросы по программированию - Обновите входное значение после проверки

Обновите входное значение после проверки

#javascript #vue.js #vuelidate

Вопрос:

Я новичок в Vue.

Я хотел бы знать, можно ли обновить входное значение после выполнения пользовательской проверки в Vuelidate. У меня есть поле ввода для почтового индекса. Я хочу вернуть почтовый индекс в правильном формате на случай, если пользователь забудет поставить пробел, и обновить поле ввода правильным значением, например

пользовательский ввод = XXXXXX
возвращенный вывод = XXX XXX

Пример кода

 export default {
  ...
  validations: {
    postcode: {
      required,
      maxLength: maxLength(10),
      validatePostcode: (value) => {
        const result = customValidators.validatePostcode(value);
        if (result !== false) {
          if (result !== value) {
            // UPDATE THE INPUT VALUE HERE WITH THE CORRECT POSTCODE FORMAT
          }
          return true;
        }
        return false;
      }
    }
  }
  ...
}

Комментарии:

1. можете ли вы поделиться каким-нибудь кодом и тем, что вы пробовали до сих пор?

2. Привет @Zero Я обновил свой вопрос выше с помощью некоторого примера кода. Я попытался обновить значение с помощью API DOM, но Vue возвращает его в конце этого блока кода.

3. Вы можете использовать v-маску для проверки формата, например, <входная v-модель=»форма.MobileNo» имя=»MobileNo» v-маска=»‘## ## ### ## ##'» >

4. @SanthoshKN Я забыл упомянуть, что поле почтовый индекс используется в сочетании со списком стран в выпадающем списке. Эта форма предназначена для глобального приложения для электронной коммерции. Итак, мы говорим здесь о множестве форматов масок.

Ответ №1:

Я изменил объявление функции стрелки на обычное объявление функции. Теперь я могу получить доступ к объекту компонента и изменить значение поля ввода с помощью модели Vuelidate. Благодаря этому: https://github.com/vuelidate/vuelidate/issues/237 🙂

Метки: