React keydown事件捕获和冒泡

时间:2018-05-22 19:13:33

标签: reactjs events

我想捕捉儿童的keydown事件。这可能吗? 所以说我有

let mc = new mongodb.MongoClient('mongodb://localhost');

await mc.connect();

if (mc.isConnected()) { ... }

let db = mc.db('test');
let collection = db.collection("test");

...

await mc.close();

我想在聚焦于div孩子的同时按下按钮时打印“Hello World”。

我已经尝试了它并且似乎没有工作,并且只要使用e.stopPropagation(),它就可以使用点击处理程序来阅读另一个SO thread。为什么它不适用于keydown事件?

1 个答案:

答案 0 :(得分:2)

我猜你实际上并没有消费onKeyDown中传递的ParentComponent道具。你需要像这样做一些事情:

class ParentComponent extends Component {
  render(){
    return(
      <div onKeyDown={this.props.onKeyDown}>
        {this.props.children}
      </div>
    )
  }
};

See this working example

以下评论中的每个OP的问题......

<强>无状态:

const ParentComponent = (props) => (
  <div onKeyDown={props.onKeyDown}>{props.children}</div>
)

在div中:

const ParentComponent = (props) => (
  <div>
    <div onKeyDown={props.onKeyDown}>{props.children}</div>
  </div>
)