@invex
Верстаю

Почему валидация не работает как нужно Vuetify?

Когда ввожу в строку больше 3 чисел все равно выбивается ошибка.

<script type="text/x-template" id="app-template">
  <v-app>
    <v-text-field
              label="Working time"
              v-model.number="workingTime"
              variant="outlined"
              hide-details="auto"
              class="my-2"
              :rules="inputsRules"
              required
            />
  </v-app>
</script>

<div id="app"></div>

const { createApp } = Vue
const { createVuetify } = Vuetify

const vuetify = createVuetify()

const app = createApp({
  template: '#app-template',
  data () {
    return {
        workingTime: "",
        inputsRules: [
          (value) => value.length <= 3 || " Error",
          (value) => !!value || "Required",
        ],
    }
  },
 
}).use(vuetify).mount('#app')


https://codepen.io/invex0811/pen/zYRdMxM
  • Вопрос задан
  • 90 просмотров
Решения вопроса 1
AntiStream
@AntiStream
Потоковый программист
value это число, а у числа нет длины, надо в начале конвертировать value в строку, чтобы сделать проверку на длину:
https://codepen.io/artyomsilantiev/pen/jOZGOEL
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы