[SOLVED] Vee Validate stops my component from running, errors.first malfunction

Vee Validate stops my component from running, errors.first malfunction

I have a buefy form that loads a buefy data table, I'm trying to validate my input fields and vee validate is my best choice.

My error message will be displayed in my message on the b-field. Something like this: :message="errors.first('lastname')"

Right now I receive the following error in my console:

vue.esm.js?efeb:1897 TypeError: _vm.errors.first is not a function

and the following warning:

[Vue warn]: Error in render: "TypeError: _vm.errors.first is not a function"

I have already searched online and tried the following solution in the main.js:

Vue.use(VeeValidate, {
  errorBagName: 'vErrors'
})

Solution

AAAAAh, figured this one out! So if you are using another npm package or addon on Vue that is using the same errors keyword in their data or functions or computed data or whatever you will need to specify in VeeValidate that will be the name of your errors, and this will only happen if any other package is prioritised above from Vee Validate. I had already done this using:

Vue.use(VeeValidate, {
  errorBagName: 'vErrors'
})

but the problem was that I hadn't used the new name in the message of the validation.

so the message would contain: vErrors.first('lastname')