Vuelidate — как мне применить правила валидации для каждого объекта отдельно?
Есть у меня форма с полями и $each применяет правила валидации для всех объектов fields, но я хочу указать разные поля первому, второму, третьему объектам, как мне это сделать?
Пробовал разные варианты и ничего не работает, инфу как-то по этому поводу тоже найти не могу...
<template v-for="v in $v.fields.$each.$iter"> <a-col :key="v.$model.id" class="form-item"> <a-form-item :has-feedback="v.value.$error" :validate-status="v.value.$error ? 'error' : ''" :label="v.$model.name" :help="v.value.$error && getErrorMessage(v.value)" > <a-input v-model.trim="v.value.$model" :placeholder="v.$model.placeholder" /> </a-form-item> </a-col> </template> |
<template v-for="v in $v.fields.$each.$iter"> <a-col :key="v.$model.id" class="form-item"> <a-form-item :has-feedback="v.value.$error" :validate-status="v.value.$error ? 'error' : ''" :label="v.$model.name" :help="v.value.$error && getErrorMessage(v.value)" > <a-input v-model.trim="v.value.$model" :placeholder="v.$model.placeholder" /> </a-form-item> </a-col> </template>
data: () => ({ fields: [ { id: 1, name: "Имя пользователя", placeholder: "Введите логин пользователя", createclientname: "name", value: "", }, { id: 2, name: "Пароль", placeholder: "Введите пароль", createclientname: "password", value: "", }, { id: 3, name: "Почта", placeholder: "Введите почту", createclientname: "email", value: "", }, ], fieldRole: "DEALER_ADMIN", }), validations: { fields: { required, $each: { value: { required, }, }, }, } |
data: () => ({ fields: [ { id: 1, name: "Имя пользователя", placeholder: "Введите логин пользователя", createclientname: "name", value: "", }, { id: 2, name: "Пароль", placeholder: "Введите пароль", createclientname: "password", value: "", }, { id: 3, name: "Почта", placeholder: "Введите почту", createclientname: "email", value: "", }, ], fieldRole: "DEALER_ADMIN", }), validations: { fields: { required, $each: { value: { required, }, }, }, }
Дополнительно:
Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Пока нет других ответов. Будьте первым, кто поможет автору.
Ответить на вопрос
Для применения правил валидации для каждого объекта отдельно в Vuelidate, вам нужно использовать функцию $each, которая позволяет применить правила к каждому объекту в массиве или объекте.
Прежде всего, убедитесь, что у вас установлен Vuelidate и вы импортировали его в ваш компонент.
Затем вы можете создать свои правила валидации, используя функцию $each. Например, если у вас есть массив объектов, и вы хотите применить правила валидации к каждому объекту, вы можете сделать это следующим образом:
import { validationMixin } from 'vuelidate' import { required } from 'vuelidate/lib/validators' export default { mixins: [validationMixin], data() { return { objects: [ { name: '', email: '' }, { name: '', email: '' } ] } }, validations: { objects: { $each: { name: { required }, email: { required } } } } }import { validationMixin } from 'vuelidate' import { required } from 'vuelidate/lib/validators' export default { mixins: [validationMixin], data() { return { objects: [ { name: '', email: '' }, { name: '', email: '' } ] } }, validations: { objects: { $each: { name: { required }, email: { required } } } } }
В этом примере мы создали массив объектов objects, и применили правила валидации к каждому объекту в массиве, где для каждого объекта мы проверяем, что имя и email обязательны для заполнения.
Теперь каждый объект будет валидироваться отдельно, и вы получите сообщения об ошибках для каждого объекта.
Надеюсь, это поможет вам применить правила валидации для каждого объекта отдельно в Vuelidate. Если у вас есть дополнительные вопросы, не стесняйтесь задавать.