如何在按钮点击后验证数据？

Question

我只需在点击提交按钮后验证输入。但是，在焦点丢失后激活所需的规则。我在Vue.js中使用了VeeValidate。

HTML：

<input 
  name="Email" 
  v-validate 
  data-vv-rules="required|email" 
  id="email" 
  type="email" 
  v-model="email" 
  placeholder="Email " 
>

JS：

this.$validator.validateAll().then(success => {

})

Answer 1

您可以使用data-vv-validate-on来禁用默认验证行为，如下所示：data-vv-validate-on="none"

然后将点击事件处理程序添加到提交按钮@click="submit"。

组件的submit方法看起来像这样：

methods: {
  submit() {
    this.$validator.validateAll().then(success => {
      // submit the value
    })
  }
}

Answer 2

如果您的 vee-validate < 4 版本，this 可能会有所帮助