React.js Неразрешенная переменная в WebStorm

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 : Я включил конструктор, который я написал. Ошибка все еще там.

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>)
}