How to get list of errors from ValidationObserver in vee-validate 3?

[valsaven]

Greetings!

I create the validation rules for several inputs. I have several ValidationProviders inside one ValidationObserver.
But outside of that I need to use computed properties to reactively update the state of the validation hints.
To do this, I need to know the field where the error is at the moment and the rule that failed.

Example:
https://codesandbox.io/s/codesandbox-forked-vxdl8?file=/src/Demo.vue

Is it possible to solve this problem with vee-validate v3?

[logaretm]

Sorry for the delay. You can access the fields property on the ValidationObserver which contains most of the ValidationProvider info like failedRules which seems to be what you want here.

<ValidationObserver v-slot="{ fields }">
  <ValidationProvider
      name="password"
      rules="required|min:4|alpha_num|password:@confirm"
      v-slot="{ errors }"
    >
      <input type="password" v-model="password" />
      <span>{{ errors[0] }}</span>
    </ValidationProvider>
    <pre>{{ fields.password.failedRules.required ? 'Failed Required' : '' }}</pre>
</ValidationObserver>