Question

                {children.map(child =>
                    <tr key=...><td>{child.hasChildren && <button onClick={this.handleClick} class="btn btn-secondary btn-sm">+</button></td></tr>
                )}

无论出于什么原因，我都无法让React渲染我的“ onclick”部分。它一直在吃掉它。

Answer 1

这只是一个错字，请将 onclick 更改为 onClick

{children.map(child =>
                <tr key=...>
                    <td><button onClick={this.handleClick}>+</button></td>
                </tr>
            )}

Answer 2

您的问题回答得不好。

有人问为什么不调用按钮的onClick事件处理程序（this.handleClick）？

如果是这样，只要您的组件中存在this.handleClick方法[并适当地界线]，就应该按预期的方式调用它。

这是一个如何在React中处理事件的示例：

class Toggle extends React.Component {
  constructor(props) {
    super(props);
    this.state = {isToggleOn: true};

    // This binding is necessary to make `this` work in the callback
    this.handleClick = this.handleClick.bind(this);
  }

  handleClick() {
    this.setState(state => ({
      isToggleOn: !state.isToggleOn
    }));
  }

  render() {
    return (
      <button onClick={this.handleClick}>
        {this.state.isToggleOn ? 'ON' : 'OFF'}
      </button>
    );
  }
}

无法使用React呈现onclick事件

2 个答案: