JSFiddle - React, Tailwind, and code Playground

by javad ebrahimi

HTML

<script src="https://cdn.jsdelivr.net/vee-validate/2.0.0-beta.18/vee-validate.min.js"></script>
<script src="https://cdn.jsdelivr.net/vue/2.1.10/vue.min.js"></script>
<div id="app">
  <input v-model="email" v-validate="'required|email'" type="text" name="email">
  <span v-show="errors.has('email')">{{ errors.first('email') }}</span>
  
  <button @click="validateEmail">validate email</button>
</div>

JavaScript

Vue.use(VeeValidate);

new Vue({
	el: '#app',
  data: () => ({
  	email: ''
  }),
  methods: {
  	validateEmail() {
    	this.$validator.validate('email',this.email);
    }
  }
});