zoukankan      html  css  js  c++  java
  • React 实现键盘监听事件

    1、在需要进行监听的Dom上添加 onKeyDown 方法:

     <Button
         className='btn-add'
         type="primary"
         icon="search"
         onKeyDown={(e)=>this.handleKeyDown(e)}
         onClick={()=>this.handleSearch()}>
         {LangMapping.Search}
     </Button>

    2、定义 handleKeyDown 方法及事件处理:

    //keyCode 38=up arrow  40=down arrow   13=Enter
    handleKeyDown = (e) => {
        if (e.keyCode === 13) {
            console.log("按下了Enter键")
            this.handleSearch();
        }
    }

    3、在 componentDidMount 钩子中定义键盘监听事件:

    componentDidMount() {
        document.addEventListener('keydown',this.handleKeyDown);
    }

    4、在 componentWillUnmount 钩子中移除键盘监听事件:

    componentWillUnmount() {
        document.removeEventListener('keydown',this.handleKeyDown);
    }

    5、参考:

    https://www.cnblogs.com/iverson-tian/p/13640450.html

  • 相关阅读:
    简单poi创建execl
    Orcale 存储过程实践总结
    PLSQL 创建自定义函数注意事项
    字符串算法模板整理
    多项式FFT/NTT模板(含乘法/逆元/log/exp/求导/积分/快速幂)
    UVALive
    Gym
    Gym
    Kattis
    Kattis
  • 原文地址:https://www.cnblogs.com/art-poet/p/13996261.html
Copyright © 2011-2022 走看看