# v-email-double-validation.vue

Go to content
Press enter

Email with double validation component

<v-data v-slot="state" :data="{ emailTest: '' }">
  <v-form method="POST" action="https://httpbin.org/post" target="_blank">
    <v-card>
      <v-stack size="small">

        <v-input placeholder="Fornavn" name="First-name"></v-input>
        <v-input placeholder="Efternavn" name="Last-name"></v-input>

        <!-- The component -->
        <v-email-double-validation
          input1-name="useremail"
          input2-name="useremail-confirm"
          input1-tooltip="Her skal du indtaste din e-mail, så vi kan sende dig en bekræftelse"
          input2-tooltip="Vi beder dig om at bekræfte din e-mail for at sikre, at vi har den korrekte"
          @update="state.emailTest = $event.target.value"
          current-email=""
          email-placeholder="E-mail"
          confirm-email-placeholder="Gentag e-mail"
          missing-email-error="Vi skal bruge din email"
          invalid-email-error="Emailadressen indeholder fejl"
          email-mismatch-error="Emailadresserne er ikke ens"
          missing-confirm-email-error="Gentag venligst din email"
        />
        <!-- /End component -->

        <!-- Test if @update is working -->
        <v-alert-local v-if="state.emailTest" success dismissible>
          Update event fired! Current value for the E-mail field: {{ state.emailTest }}
        </v-alert-local>

        <v-input placeholder="Telefonnummer" name="Phone" type="number" strict></v-input>
        <v-button tag="button">Submit form</v-button>

      </v-stack>
    </v-card>
  </v-form>
</v-data>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37