代码之家  ›  专栏  ›  技术社区  ›  Lioo

VueLidate在页面加载时多次触发

  •  2
  • Lioo  · 技术社区  · 5 年前

    我正在使用Vue,为了验证, Vuelidate .

    当使用执行Ajax调用的自定义验证器时, 它发射了多次 在页面加载时,甚至在用户交互之前(vuelidate's $touch )

    在第一次加载时多次调用之后,验证工作正常。(我在输入更改时使用此验证,使用Vue @change )

    我试着设置旗帜 isMounted 只在加载了整个实例后才在de-custom验证器内执行验证,但没有成功。

    代码

    验证程序(仅用于调试,用于测试):

    validations() {
        return {
            myFieldToValidate(field) {
                test_validation(value) {
                    console.log('test validation fired!', Math.random());
                    return true;
                }
            }
        }
    }
    

    然后,当我重新加载页面时,它会多次触发:

    multiple-calls

    我只想通过我的事件(输入更改)进行“触发”验证,而不是在页面加载时多次进行验证。如何做到这一点?

    2 回复  |  直到 5 年前
        1
  •  0
  •   Samantha    5 年前

    @change.once 应该做这个把戏

    有关详细信息,请参阅链接 https://vuejs.org/v2/api/#vm-once

        2
  •  0
  •   Lioo    5 年前

    我最后创建了自己的函数来进行Ajax调用,将 vuelidate . 我用过 lodash' _.debounce 控制通话。

    我将函数绑定到 @input 事件,使 ajax 基于它调用,并返回带有结果的“flag”属性。

    然后,我使用这个标志来检查字段的有效性。

    使用此abortage,在页面加载时事件不会触发多次。