javascript - WebStorm 中的 React.js 未解析变量

Question

我unresolved variable在以下代码段中遇到问题：

constructor(props) {
    super(props);
    this.handleModalView = this.handleModalView.bind(this);
}

handleModalView() {
    this.refs.temp.handleShow();
}

render() {
  return (
    <div className="App">
      <ModalView ref = 'temp' />
      <img src="some_image_source"
        className="SettingsLogo" onClick={this.handleModalView}
      />
  </div>

IDE 显示一个unresolved variable temp在handleModalView(). 但是，我的代码工作得很好。

编辑 1：我已经包含了我编写的构造函数。错误仍然存​​在。

标签： javascriptreactjswebstorm

Answer 1

您应该在组件类中创建一个构造函数并绑定所有成员函数：

class App extends Component {
    constructor(props) {
      super(props);
      this.handleModalView = this.handleModalView.bind(this);
    }

    handleModalView() {
      this.refs.temp.handleShow();
    }

    render() {
      return (
        <div className="App">
          <ModalView ref = 'temp' />
          <img src="some_image_source"
            className="SettingsLogo" onClick={this.handleModalView}
          />
        </div>)
}