Using Vuelidate, how to generate error if what the user inputs already exists in db?

Question

I'm creating a form using Vue JS, more specifically the Vuetify framework.

I've already created a way to show an error when an item doesn't exist, however how can I make it so that it also shows an error if what the user enters already exists in the database?

    data: () => ({
        aRule: [
            v => !! v || 'Please provide project type',
        ],
    }),

My form component looks like this:

    <v-text-field
        :rules="aRule"
        label="Project Type"
        v-model="choice.data"
    >
    </v-text-field>

Please note that 'choice.data' represents the data column in the database

Answer 1

The rule should be like this

emailRules = [
    v: => !!v || "email address is required",
    v: => /.+@.+\..+/.test(v) || "Please input a valid email",
    v: => (v && this.doesUserExist != true) || "Email already exists.",
  ];

initialize doesUserExist = null; set this.doesUserExist = true; , when server response user already exist.