vue validation code example

Example 1: submit form in vue

//HTML
<div id="vueRoot">
  <form ref="form">
    <input name="vitalInformation" v-model="store.vital">
    <a href="#" v-on:click="submit">SUBMIT</a>
  </form>
</div>

//JS
vm = new Vue({
  el : "#vueRoot",
  methods : {
    submit : function(){
      this.$refs.form.submit()
    }
  }
});

Example 2: npm install vuelidate

npm install vuelidate --save

Example 3: vuelidate required if another props

elements: {
            $each: {
              type: {
                required,
              },
              question: {
                required: requiredIf(prop => prop.type === 'input'),
              }
            }
          }

Example 4: vuelidate same as

validations: {
    form: {
      old_password: {
        data: { required },
      },
      new_password: {
        data: { required },
      },
      repeat_password: {
        data: { 
          sameAsPassword: sameAs(function() {
            return this.form.new_password.data;
          }) 
        },
      },
    },
  },

Example 5: vuelidate custom validation

const price_greater = (value, vm) => (value >= vm.min_price);
validations: {
    user_price: {
         required,
         price_greater
       }
}