输入中文时如何使 onInput 不触发

[981377660LMT]

https://juejin.cn/post/7209577525285863483

[981377660LMT]

const InputPanelBody: NormalFilterPanelBody = React.forwardRef((props, inputRef) => {
  const { model, filterConfigItem, path, forceUpdateFilterArea } = props;
  const utils = getFilterConfigUtils(model.config.filter.filterConfig);
  const { colId, value: filterConfigItemValue } = filterConfigItem;

  const initValue = parseValue(model, colId, filterConfigItemValue);
  const [inputValue, setInputValue] = useState<string>(initValue);
  const inputLock = useRef<boolean>(false);

  const handleValueChange = (e: React.ChangeEvent<HTMLInputElement> | React.CompositionEvent<HTMLInputElement>): void => {
    setInputValue(e.currentTarget.value);
    if (inputLock.current) return;
    // submit
    const newValue = formatValue(model, colId, e.currentTarget.value);
    utils.patchNode(path, { value: newValue });
    filterBaseTransaction(model, utils.root, 'change');
    forceUpdateFilterArea();
  };

  return (
    <Input
      value={inputValue}
      onChange={handleValueChange}
      dispatchChange={['onInput', 'onBlur']}
      placeholder="请输入关键词"
      ref={inputRef}
      onCompositionStart={() => {
        inputLock.current = true;
      }}
      onCompositionEnd={(e) => {
        inputLock.current = false;
        handleValueChange(e);
      }}
    />
  );
});