vee-validate如何实现每输入一个字符就触发校验，而非仅失焦时生效

方案1：针对单个输入框配置触发时机（推荐，灵活度更高） #

vee-validate 支持给v-validate指令加修饰符指定校验触发事件，添加.input修饰符即可在每次输入字符时触发校验。

密码输入框修改后代码 #

<div class='form-group' :class='{"form-group_invalid": errors.has("password") && errors.has("password:min")}'>
  <input
    v-validate.input='"required|min:8|confirmed:password_confirmation"'
    type='password'
    name='password'
    v-model='user.password'
    ref='password'
  />
  <div class='form-group__error'>{{ errors.first('password') }}</div>
</div>

确认密码输入框修改后代码 #

<div class='form-group' :class='{"form-group_invalid": errors.has("password:confirmed")}'>
  <input
    v-validate.input='"required|confirmed:password"'
    type='password'
    name='password_confirmation'
    v-model='user.passwordConfirmation'
    ref='password_confirmation'
  />
  <div class='form-group__error'>{{ errors.firstByRule('password', 'confirmed') }}</div>
</div>

方案2：全局配置默认触发时机 #

如果项目内所有表单都需要输入时实时校验，可以在引入VeeValidate时全局配置触发事件：

import VeeValidate from 'vee-validate'
Vue.use(VeeValidate, {
  // 框架默认触发事件为blur|change，新增input事件即可实现实时校验
  events: 'input|blur|change'
})

全局配置后不需要给单个指令加.input修饰符，所有绑定v-validate的输入框都会在输入时自动触发校验。

内容的提问来源于stack exchange，提问作者Alex