0

我有一个对象数组,我使用 v-for 对其进行迭代,并为对象的一个​​属性创建一个输入,并在该输入上使用 vee-validate。我想延迟验证,所以我使用 v-model.lazy 仅在更改时更新,这就是问题发生的地方。数据绑定似乎没有正确发生。下面的小提琴重现了我的问题。任何建议将不胜感激。

https://jsfiddle.net/1r944gnc/

Vue.use(VeeValidate)

new Vue({
  el: '#app',
  data: {
    users: [
      {
        email: null
      }
    ]
  },
  methods: {

  }
})

<div id="app">
    <div v-for="user in users">
      <input type="text" name="foo" v-model.lazy="user.email" v-validate="'email'" />
      <span v-show="errors.has('foo')">{{ errors.first('foo') }}</span>
    </div>
</div>
4

1 回答 1

1

我认为这是 VeeValidate 的一个错误。

有一种解决方法与您的愿望具有相同的效果:验证blur事件

<div id="app">
    <div v-for="user in users">
      <div>Email: {{ user.email }}</div>
      <input type="text" name="foo" v-model="user.email" v-validate="'email'" data-vv-validate-on="blur"/>
      <span v-show="errors.has('foo')">{{ errors.first('foo') }}</span>
    </div>
</div>

演示https://jsfiddle.net/4zjf2ph3/

于 2018-05-24T04:03:49.403 回答