javascript - npm run build 后 React 组件的 onClick 未呈现

Question

我有一个 React 组件:

class Control extends React.Component {
  constructor(props) {
    super(props);
    this.handleSaveFile = this.handleSaveFile.bind(this);
    this.handleExecFile = this.handleExecFile.bind(this);
  }

  handleSaveFile(e) {
    ...
  }

  handleExecFile(e) {
    ...
  }

  render() {
    return (
      <div id={this.props.name} className="Control" >
        <button onClick={this.handleSaveFile}>Save</button>
        <button onClick={this.handleExecFile}>Exec</button>
      </div>
    )
  }
}

使用 npm run build 构建项目后，应用程序显示正确，但“控制”组件 HTML 已减少为:

<div id="control" class="Control">
    <button>Save</button>
    <button>Exec</button>
</div>

换句话说，“onClick”似乎已经被优化掉了。

我不确定为什么会发生这种情况？

我是 React.js 的新手，也是前端开发的新手，感谢您的帮助。

Answer 1

使用该应用程序一段时间后，我明白发生了什么。

事实上，React 组件的 HTML 中没有呈现“onClick”，但该组件确实响应了点击。 onClick 只是由框架以不同的方式注册。