Как решить проблему Поддержка экспериментального синтаксиса ‘classProperties’ в настоящее время не включена

#javascript #reactjs #babeljs

#javascript #reactjs #babeljs

Вопрос:

У меня есть эта ошибка Поддержка экспериментального синтаксиса ‘classProperties’ в настоящее время не включена, когда я пытаюсь запустить react js приложение.

Я пытаюсь увеличить значение внутри a <span> , когда я нажимаю `

Вот фрагмент кода, касающийся моей работы…

  import React, {Component} from 'react';

 export default class Test extends Component {

  constructor(props) {
    super(props);

    this.state = {
      counter: 0
    }
  }

  handleClick = () =>{ //this is where it triggers the error mentioned above
    this.setState((state) => ({counter: state.counter 1}));
  }


  render() {
    return (
      <div>
        <span>{this.state.counter}</span>
        <input type="button" value={this.props.value}
               onClick={this.handleClick} />
      </div>
    );
  }

}
 

Но я получаю эту ошибку Поддержка экспериментального синтаксиса ‘classProperties’ в настоящее время не включена

Может кто-нибудь мне помочь?

Ответ №1:

Вы должны быть осторожны со значением этого в обратных вызовах JSX. В JavaScript методы класса не привязаны по умолчанию. Если вы забудете связать this.handleClick и передать его в onClick , это будет не определено при фактическом вызове функции, поэтому вам нужно написать приведенный ниже код в конструкторе

   constructor(props) {
    super(props);

    this.state = {
      counter: 0
    }
    this.handleClick = this.handleClick.bind(this);
  }
 

Комментарии:

1. это не отвечает на вопрос о classProperties