如果您在运行时间时收到数据，如何重置setTimeout？

问题描述

我的VUE应用程序中有一个文本类型输入，用于收集数据，完成收集后，我必须显示另一个组件。

data={'a':{'b':1}}
ensure_path(data=data,path=['a','c'],default=[1])
print(data) #=> {'a':{'b':1,'c':[1]}}
ensure_path(data=data,default=[1],default_func=lambda x:x+[2])
print(data) #=> {'a': {'b': 1,'c': [1,2]}}

这是我控制交互的方法。我正在通过按键检测它们何时开始输入输入内容，何时出现.length时，我启动settimeout来给他们时间键入和显示加载程序并加载下一个组件。

                <input
                type="text"
                v-model="textFormInfo.text"
                @keypress="onChangeText($event)"
                />
                <div class="loader-spinner" v-if="loading">
                  <app-loader ref="spinner"/>
                </div>

问题是，如果键入速度太慢或信息太长，则在完成键入之前会显示下一个组件。我试图确保每次收到按键ecent时都会重置settimeout，以便仅当我停止接收按键时才应用总settimeout值。

我尝试遵循使用clearTimeout方法的示例，但在这种情况下我看不到如何实现。我怎么能得到这个？任何想法。

打个招呼，在此先感谢您的时间和帮助

解决方法

我认为您在这里要实现的目标是反跳，如果我没错，您可以在每次kry按下时都这样做，我们会创建一个超时，如果在一定时间内没有按下该键，则将调用settimeout中的方法

var timeoutId = 0;
    function keypress() {
          if (timeoutId >= 0) {
            clearTimeout(timeoutId);
          }
          timeoutId = window.setTimeout(() => {
            callMethod();
          },500);// time to wait to listen for next keypress if not pressed callMethod will execute
        }

javascript settimeout vue.js