React下拦截ctrl+s和command+s快捷键

目前网络上关于拦截快捷键的资料较老,这里其实可以用KeyboardEvent

通过event.key可以快速获取到当前按下的键代表的意义,比如按下"s"键,event.key的值即为"s",按下键盘上的ctrl或者command后,event.ctrlKeyevent.metaKey会成true,这样可以识别出ctrl+scommand+s组合键。

  // 按下ctrl+s或command+s时调用保存
  const handleKeyDown = (event: React.KeyboardEvent) => {
    if (event.key === "s" && (event.ctrlKey || event.metaKey)) {
      // do some saving
      // props.handleSave && props.handleSave(value);
      event.preventDefault();

      // remove test log when api called
      console.log("should save code");
    }
  };

你可能感兴趣的:(React下拦截ctrl+s和command+s快捷键)