vuetify.js - Vuetify - validate programmatically added field values

Question

I have seen the examples for a v-form here.(https://vuetifyjs.com/en/components/forms/).

They work as expected and produce error messages when a user inputs an invalid value.

I do not see how to validate programmatically. Below is a bare-bones example.

 <v-form v-model="valid" ref="form">
   <v-text-field v-model="foo" :rules="someRules" label="Test Field"/>
   <v-btn @clicked="changeValue">Change Value</v-btn>
 </v-form>
 ...
 changeValue() {
  this.foo = "somethingInvalid";
  // this.$refs.form.validate();
 }

If the user typed something invalid into the v-text-field a validation error would be shown (as expected). However if it is done via the changeValue() call the validation error is not shown.

I have also tried the forms validate() method, but it doesn't seem to do anything.

question from:https://stackoverflow.com/questions/65600937/vuetify-validate-programmatically-added-field-values

Answer 1

Waitting for answers