react 快捷键保存

最新推荐文章于 2022-07-06 14:47:26 发布

原创最新推荐文章于 2022-07-06 14:47:26 发布 · 698 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#react control+s #react control+s 阻止浏览器默认行为 #react control+s 快捷键保存

react 专栏收录该内容

4 篇文章

订阅专栏

尊重大神的成果附上链接http://react-china.org/t/react/27050

直接上代码，注意reacr版本

 componentDidMount() {
    document.addEventListener("keydown", this.onKeyDown)
  }

  componentWillUnmount() {
    document.removeEventListener("keydown", this.onKeyDown)
  }

  onKeyDown = (e) => {
    if (e.ctrlKey && e.keyCode == 83 || e.metaKey && e.keyCode == 83) {
      console.log('----', e.keyCode, e.ctrlKey, e.metaKey, e.shiftKey)
      e.preventDefault();
      console.log('-----开始保存了')
    }
  }

为什么要做双判断，因为考虑用户使用系统不同windows适用于 ctrlKey ，mac适用于metaKey（目前不是很了解原因)

e.preventDefault()为除IE浏览器外阻止浏览器默认行为的方法