Javascript 为什么我的handleChange函数会导致键入延迟？

这个handleChange函数正在按我所希望的方式工作，但它会导致键入延迟。我假设这与

setTimeout

函数有关。有没有办法消除这种滞后现象，或者将其最小化到不明显的程度？这是行不通的

如果我从handleChange方法中删除代码，延迟就会消失

handleChange = (e) => {
    const targetName = e.target.name;
    const targetValue = e.target.value;

    this.setState((state) => {
      clearTimeout(this.state.editingTimeout[targetName]);
      return {
        editing: false,
        editingTimeout: {
          ...state.editingTimeout,
          [targetName]: setTimeout(() => {
            console.log(`${targetName}: ${targetValue}`);
            this.setState({
              [targetName]: targetValue,
            });
          }, 300),
        },
      };
    });
  };

---

如果在每次击键时添加超时，则应执行以下操作：

import debounce from 'lodash.debounce'

...
onClick={debounce(this.handleChange, 500)}

---

不知道为什么您会在编辑时超时使用

setTimeout

，您正在延迟输入值的实际更改。因此，如果键入“h”，则将值更改为“h”的函数将在300ms内调度。在300毫秒内创建的任何更改事件都不会包含“h”，因为该值尚未更改。所以在你输入的最后一个字母300毫秒后，输入的值将变为最后一个字母。好的，这是有意义的。我想做的是，当他们打字时，实时更改文本字段中显示的内容。。。但一旦他们停止输入一点，自动保存该值。很难做到这一点。这对我不起作用。给我一个关于合成事件和“无法读取null属性名”的错误