Question

我们遇到了一个奇怪的问题，该问题已通过Vee-Validate进行了验证我们有一个输入：

 <input
            v-validate="'required|name'"
            id="firstName"
            v-model="firstName"
            :class="{'is-invalid': errors.has('firstName'), 'filled': firstNameFilled}"
            type="text"
            class="form-control"
            name="firstName">
          <label for="firstName">Vorname*</label>

以下脚本：

    computed: {
        ...mapGetters({
          formData: 'registration/formData'
        }),
     firstNameFilled () {
         return this.formData.firstName !== null
        },
      firstName: {
         get () {
            return this.formData.firstName
         },
      set (data) {
        this.$store.dispatch('registration/updateFormData', { firstName: 
          data })
        }
       },
     methods: {
       async validate () {
          this.registrationButtonDisabled = true
         try {
            const needCaptcha = this.$route.query.utm_campaign && 
           this.$route.query.utm_campaign.includes('display');
          this.$store.dispatch('registration/updateFormData', { needCaptcha: needCaptcha });

         const result = await this.$validator.validateAll()
         if (result) {
          this.next()
         }
        } catch (e) {
         console.log(e)
        }
        this.registrationButtonDisabled = false
       }

问题：

在某些移动版Chrome（版本7）上，当您开始在输入字段中输入内容时，该字段会立即重置并验证错误。注意：

并非所有版本7的Chrome都会发生这种情况，具体取决于设备
如果您将键盘连接到手机，则可以正常使用
只有在通过触摸键盘完成初始化后对该字段的第一个输入时，它的行为才会如此。如果使用普通键盘键入，请重置该字段，然后使用触摸键盘键入。
如果您不键入而是使用触摸键盘建议，它将正确验证但仍为空。在这种情况下，将设置filled-Class。这使我们认为该模型是出于某种奇怪的原因而设置，验证并重新设置的。

这显然很难调试，有人知道吗？

Answer 1

因此Vee-Validate中存在一个错误。在某些移动设备上，(cy) $ python3 ./setup.py build_ext --inplace --quiet cpdef main(): cdef const char *headers[3] = {"to", "from", "sender"} ^ ------------------------------------------------------------ letters.pyx:5:32: Syntax error in C variable declaration的处理方式不同，这意味着$watch-API并非实时更新。 v-model无法解决这个问题。

一种解决方法是将v-validate添加到输入中，以使vee等到实际设置模型为止。

尽管开发人员在几个月前做出了承诺，但似乎尚不清楚这是否会得到解决。

这里是GitHub讨论的链接：invokestatic

问题似乎与某些设备上的Chrome有关，与所使用的版本以及Safari无关。 Firefox看起来很稳定

使用VeeValidate进行VueJS表单验证，无法在某些移动设备上输入

1 个答案: