web-dev-qa-db-ja.com

複数回の呼び出しをアンダースコアデバウンス

_.debounce()を呼び出すと、関数は遅延後に1回ではなく、複数回実行されます。 _.debounce()内の関数を、指定された遅延後に1回実行するにはどうすればよいですか?私のユースケースは、ユーザーが入力を停止した後にAJAXリクエストを実行することです。

たとえば、入力を入力すると、1秒後にコンソールにメッセージが表示されます。私の例では、複数のメッセージが表示されます(入力した文字ごとに1つ)。メッセージを1つだけ表示するようにコードを変更するにはどうすればよいですか?

https://plnkr.co/edit/3dGm55ZFqWe4V59HLgoC

function onKeyUp() {
    _.debounce(() => {
        console.log('foo');
    }, 1000)();
}
<input onkeyup="onKeyUp()" />
7
Jon

すべてのキーアップイベントで新しいデバウンス関数を作成しています。代わりに、一度作成して、onKeyUpイベントハンドラー内(または代わりに)でこの関数を使用する必要があります。

var handler = _.debounce(() => {
  console.log('foo');
}, 1000)

function onKeyUp() {
  handler();
}
<script src="http://underscorejs.org/underscore-min.js"></script>
<input onkeyup="onKeyUp()" />
18
AlexSkorik