Vuelidate Error Extractor 2

Vuelidate-error-extractor makes error message display from Vuelidate a breeze. Display errors for a single form field or all the errors in a form summed up.

Key features

  • 🚀 Easy to use
  • 💥 Flexible - can be tailored to fit your needs
  • 🔥 Optional templates - yey mixins and slots!!!
  • 👊 No extra styling mucking your own
  • 💪 Tested

Error messages can be styled to fit either Foundation 6, Bootstrap 3 and Bootstrap 4 styles out of the box, or can be totally customized via your own custom templates.

The plugin is also able to work as a standalone component or in tandem with vue-i18n - see Using with vue-i18n.

Continue to installation instructions for instructions on how to set it up.


Upgrade Guide

Version 2 added some breaking changes. Instead of reaching into templates directly for the predefined templates, you need to go into either templates.singleErrorExtractor or templates.multiErrorExtractor. Everything else is backwards compatible.

import VuelidateErrorExtractor, { templates } from 'vuelidate-error-extractor'
Vue.use(VuelidateErrorExtractor, {
  template: templates.singleErrorExtractor.foundaton6