Skip to content

Instantly share code, notes, and snippets.

@jamesxv7
Created April 17, 2017 18:10
Show Gist options
  • Save jamesxv7/0c020103c9a618c27c8fa4daba7a8405 to your computer and use it in GitHub Desktop.
Save jamesxv7/0c020103c9a618c27c8fa4daba7a8405 to your computer and use it in GitHub Desktop.
// Kevin Pilard @kpilard Apr 11 16:17
// @jamesxv7
import { Validator } from 'vee-validate';
var app = new Vue({
el: '#app',
created () {
this.validator = new Validator(this.validationRules)
},
data: {
validator: null,
validationRules: {
name: 'required|alpha|min:3',
email: 'required|alpha|min:3'
},
name: null,
email: null
},
computed: {
errors() {
let errors = {}
Object.keys(this.validationRules).forEach(key => {
if (!errors[key]) {
errors[key] = []
}
this.validator.validate(key, this[key]).catch(() => {})
})
this.validator.getErrors().errors.forEach(error => {
errors[error.field].push(error.msg)
})
return errors
}
}
});
// ---
<div id="app">
<v-text-field v-model="email" label="Email" :rules="errors.email"></v-text-field>
<v-text-field v-model="name" label="Name" :rules="errors.name"></v-text-field>
</div>
// You could use something like this. You can copy most parts in a mixin to reuse it
@aaronjpitts
Copy link

aaronjpitts commented May 22, 2017

Got it working with the below, but is it the best way?

          if (this.fields && this.fields[error.field] && this.fields[error.field].dirty) {
            errors[error.field].push(error.msg);
          }

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment