SoFunction
Updated on 2025-04-04

How to implement better Form validation using vuejs?

How to verify Form verification with vuejs? If the verification fails, it will not jump, and it will jump only if it succeeds? I tried several methods but failed to implement them. I was very depressed. I either did not verify it or did not jump after verification.

<input type="button" v-on:click="return submit()" class="btn btn-success" value="GO"/>

How to achieve better Form validation with vuejs?

It seems that there is more information about vue-validator, so I plan to use this next:/vuejs/vue-validator

vue for form validation currently has three plugins

vue-validator

Vue validator

vue-form

For example, I'm using vue-form

html:

&lt;form v-form name="myform" @="onSubmit" role="form"&gt;
         &lt;legend class="text-center"&gt;Vue-form demo&lt;/legend&gt;
          &lt;div class="form-group"&gt;
             &lt;label&gt;Mail*&lt;/label&gt;
              &lt;input class="form-control" v-model="" v-form-ctrl required name="name" /&gt;
            
          &lt;/div&gt;
          &lt;div class="form-group"&gt;
            &lt;label&gt;username*&lt;/label&gt;
              &lt;input class="form-control" v-model="" v-form-ctrl name="email" type="email" required /&gt;
            
          &lt;/div&gt;
          &lt;div class="errors" v-if="myform.$submitted"&gt;
            &lt;p class="bg-danger text-center" v-if=".$"&gt;请输入username.&lt;/p&gt;
            &lt;p class="bg-danger text-center" v-if=".$"&gt;请输入正确的Mail.&lt;/p&gt;
          &lt;/div&gt;
          &lt;button class="btn btn-success btn-block" type="submit"&gt;submit&lt;/button&gt;
&lt;/form&gt;

js:

new Vue({
  el: '#app',
  data: {
    myform: {},
    model: {}
  },
  methods: {
    onSubmit: function() {
      (.$valid);
      if(.$valid==true)
        alert("Submitted successfully");
    }
  }
});

The complete demo code ishereClick Preview to view

The above is all the content of this article. I hope it will be helpful to everyone's study and I hope everyone will support me more.