You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I started using vee-validate along with yup for my form validation needs. I'm not quite sure how to provide conditional error styling to my input fields with my particular configuration.
const schema = markRaw(
object().shape({
name: string()
.required('Name is required')
.min(5, 'Name must be more than 5 characters long')
.max(150, 'Name must be fewer than 150 characters long')
.matches(
constants.alphanumericRegexCheck,
'Name must be alphanumeric'
)
})
);
So the ErrorMessage tag shows up fine. I'm not quite sure where to find the error information contained by yup so that I could add styling to the Field as well.
Would I need to call schema.validateAt()? It seems like this would be redundant to the existing Blur checking that the ErrorMessage tag does.
PS is there a version of auto-css to import for Vue 3?
import VeeValidate from 'vee-validate';
Vue.use(VeeValidate, {
classes: true
});
reacted with thumbs up emoji reacted with thumbs down emoji reacted with laugh emoji reacted with hooray emoji reacted with confused emoji reacted with heart emoji reacted with rocket emoji reacted with eyes emoji
-
Hi,
I started using vee-validate along with yup for my form validation needs. I'm not quite sure how to provide conditional error styling to my input fields with my particular configuration.
I have the following configuration:
and using yup's schema:
So the
ErrorMessage
tag shows up fine. I'm not quite sure where to find the error information contained by yup so that I could add styling to theField
as well.Would I need to call
schema.validateAt()
? It seems like this would be redundant to the existing Blur checking that theErrorMessage
tag does.PS is there a version of auto-css to import for Vue 3?
Beta Was this translation helpful? Give feedback.
All reactions