How to know if rule is failing in vuetify's v-text-field?

Viewed 27578

How do I know if a "rule" is failing in vuetify? I have a text field

<v-text-field label="Friendly URL" :rules="[rules.friendlyUrl]" v-model="friendlyUrl"></v-text-field>

And my rules definition:

data () {
  return {
    rules:{
      friendlyUrl(value){
        console.log('validating value');
        if (/^[a-z0-9\-]*$/.test(value)){
          return true;
        }
        return 'only lowercase letters, numbers and dashes are allowed'
      }
    }
  }

I want to "watch" something to know if my rule has failed or not. That way I can disable a submit button until all rules have passed.

Bonus points if you know how to set this up for multiple text fields.

1 Answers
Related