базовый c вопрос, связанный с увеличением и уменьшением счетчика в реакции - PullRequest
2 голосов
/ 18 марта 2020

Это базовый c вопрос. Я начал изучать React, и у меня есть задание, в котором я должен изменить значения кнопками увеличения и уменьшения. Я реализовал это с помощью компонента класса способом.

но у меня есть сомнения. Обратитесь к приведенному ниже коду, где значение будет изменено.

increment = () => {
    this.setState({
      count: this.state.count + 1   //HERE -----------------
    });
  };

Почему это не так ??

increment = () => {
    this.setState({
      this.state.count: this.state.count + 1    // Here ...ERROR COMES
    });
  };

Так почему к нему нет доступа, как this.state. count: this.state.count + 1 ?? Пожалуйста, дайте мне знать причину.

1 Ответ

3 голосов
/ 18 марта 2020

Причина, по которой это не работает, заключается в том, что присвоение значений внутри объекта имеет синтаксис, отличный от присвоения нормальной переменной.

Для уточнения:

При создании объекта вы используете этот синтаксис :

let myObj = {
  foo: 'bar'
}

Или вы можете сделать:

let myObj = {}

myObj.foo = 'bar'

Но вы не можете сделать

let myObj = {
  myObj.foo: 'bar'
}

Что вы делаете с функцией setState создает новый объект и передает его функции.

Вы должны так же легко написать это так:

const newState = { count: this.state.count + 1 }
this.setState(newState);

Вот почему вы должны использовать первый синтаксис.

Тогда setState объединяет данный объект с текущим this.state и при следующем рендеринге this.state будет содержать обновленные значения.

...