Question

我正在编写一个聊天机器人应用程序，并希望通过模糊输入字段并在3秒钟后（机器人响应时）重新集中注意力来捕获多个用户输入。

我为此使用了setTimeout，它第一次工作，但是在多次调用该函数后，它似乎变短了。

我使用的代码在React聊天小部件中，如下所示：

handleKeyPress = (e: KeyboardEvent) => {
    if (e.keyCode === 13 && this.input.value.replace(/\s/g, "")) {
        this.input.blur();
        this.say(this.input.value);
        // Reset input value
        this.input.value = "";
        this.refocus(document.getElementById('userText'));
    }
};

refocus = (element: HTMLElement) => {
    var time = setTimeout(function() {
        element.focus();
    }, 3000);
};

在这段代码中，我在将消息发送到后端机器人应用程序之后使用了setTimeout，以便机器人有一些时间来回答。

我不知道为什么这不起作用，可以真正使用一些建议...

Answer 1

我找到了解决我的问题的方法。看来问题与focus() / blur()方法有关。我在延迟3秒后使用了disable = true和disable = false和focus()，现在延迟总是3秒。

代码现在看起来像这样：

handleKeyPress = (e: KeyboardEvent) => {
    if (e.keyCode === 13 && this.input.value.replace(/\s/g, "")) {
        this.input.disabled = true;
        this.say(this.input.value);
        // Reset input value
        this.input.value = "";
        this.enable((document.getElementById('userText') as HTMLInputElement));
    }
};

enable = (element: HTMLInputElement) => {
    setTimeout(function() {
        element.disabled = false;
        element.focus();
    }, 3000);
};

setTimeout似乎越来越短

1 个答案: