Vee-validate: A way to access validation state from outside observer

[ghost]

Is your feature request related to a problem? Please describe.
A way to access validation state from outside of observer.
Button in the example is outside. How can i access valid state in this case?

<template>
  <ValidationObserver v-slot="{invalid}">
    <form>
      <ValidationProvider v-slot="props">
        <input type="text" name="fname" v-validate="'required'" />
      </ValidationProvider>

      <ValidationProvider v-slot="props">
        <input type="text" name="lname" v-validate="'required'" />
      </ValidationProvider>
    </form>
  </ValidationObserver>
  <button :disabled="isInvalid">Submit</button>
</template>   

[logaretm]

Why would that button be outside the observer? doesn't make sense to me. and there are no plans to implement state reducers for this.

[ghost]

I have my reasons

[ghost]

@logaretm
You know there is native support for form element to be accessed outside of form. Is this hard to implement?
<button form="formId"/>

[logaretm]

Yea, I know and it is hard to implement, the closest thing you have now is with using $refs and navigating the ValidationObserver instance manually, you could access the valid state there using $refs.observer.flags.valid but that might not be reactive depending on your template.

[ghost]

Better than nothing. Thank you.

[ghost]

@logaretm Later thoughts. I don't know about state reducers but this may be done using events. I really think this is required feature. Library may be more stable but not as flexible as it used to be.