0

Have some problem when try to use vuelidate plugin in single file component

app.js 



import Vue from 'vue';
import Vuelidate from 'vuelidate';

Vue.use(Vuelidate)

const T = new Vue({
  router: router,
  template: '<div id="app"><heading></heading><transition :css="false" mode="out-in" @enter="enter" @leave="leave"><router-view></router-view></transition></div>',
  data: {
    currentRoute: window.location.href,
  },
  created(){
    this.$watch('$v', () => {
       console.log('$v changed')
    })
  },
  validations: {}
}).$mount('#app');

--

<template>
  <form id="registration" class="form form_bl " @submit="handleSubmit" action="">
  <input type="email"  v-model="email" name="email" class="inp m30_b" placeholder="E-mail">
  <button class="btn">Send</button>
</template>

import { validationsMixin } from 'vuelidate';
import { required, minLength } from 'vuelidate/lib/validators';
export default {
  data () {
    return {
      email: ''
    }
  },
  validations: {
    email: {
      required,
    }
  },
  methods: {
    handleSubmit: function(e) {
      e.preventDefault();
      console.log($v.email);
    }
  }
}

and I've just got $v is not defined, I try everything

reorder components include Vuelidate inside .vue file

but nothing help

Derek Pollard
  • 6,953
  • 6
  • 39
  • 59
Romarch
  • 1
  • 3

0 Answers0