Debounce effect

[mrcha90]

Is it possible to add debounce effect functionality? It is little bit annoying to see red error (for example "email") after first letter was written. Or when I have async call, I don't want to call api after every single keypress. Better solution would be wait 1,2 seconds and then call async function. Really appreciate simplicity of Vuelidate!

[mrcha90]

I have found solution in your prev issue. So it's ok.

[Frizi]

Could you please add a reference where have you found it? Creating list of useful examples is on a roadmap for the docs.

[shyamchandranmec]

@mrcha90
Could you please add your solution here.

[RoundRobin-fr]

_.debounce from lodash does not return the result of the debounced function so the validator cannot work.

You could use this debounce version to make sure every call to the debounced function resolves their promise with the result of the latest call during the interval.

const debounce = (callback, timeout) => {
    let timer;
    const resolvers = [];
    return async (...args) => {
        clearTimeout(timer);
        return new Promise((resolve) => {
            resolvers.push(resolve);
            timer = setTimeout(async () => {
                const result = await callback.apply(this, args);
                resolvers.map((resolver) => resolver(result));
            }, timeout);
        });
    };
};

const rules = {
    name: {
        test: helpers.withAsync(
            debounce(() => {
                return false;
            }, 1000)
        ),
        $lazy: true,
    },
};