javascript - React 组件不调用 onClick 处理程序

Question

我有一个使用 es6 类语法构建的组件。它是一个简单的组件，具有多种多样的样式。然后，在父组件(称为 app)上，我想呈现该组件并给它一个调用父级 onclick 处理程序的 onClick。到目前为止，父级渲染子级是这样的:

<child_component onClick={this.clickhandler}>

然后我在该父组件中有一个方法，我已在构造函数中绑定(bind)到父上下文。

组件呈现，但单击该组件时从未调用单击处理程序。知道为什么吗？

Answer 1

由于子组件不是原生 DOM 元素，而是另一个 React 组件，此处定义的 onClick 只是该组件的一个属性。您需要做的是，在子组件内部将 onClick 属性传递给 DOM 组件的 onClick 事件:

var ChildComponet= React.createClass({
 render: function() {
 return (
   <div className="childcomponent" onClick={this.props.onClick}>
   ...
    </div>
  );
 }
 });