добавить инкрементный счетчик, используя неработающие операторы приложения React ++ - PullRequest
0 голосов
/ 14 июля 2020

Я пытаюсь написать метод голосования каждый раз, когда пользователь нажимает кнопку, он должен увеличиваться на 1, это происходит с приведенным ниже кодом

ретро. js

  export class RetroComponent extends Component {
      constructor(props) {
        super(props);
        this.textareaRef = React.createRef();
        this.state = {
          value: 0
        }
      }
      addCard(){
        console.log("add card");
      }
      incrementWentWell() {
        // eslint-disable-next-line react/no-direct-mutation-state
        return ++this.state.value;
      }
    render() {
          return (
        <IconButton onClick={() => this.incrementWentWell()}>
                      <ThumbUpTwoToneIcon />
                    </IconButton>
       <h5 style={{marginRight: 10}}><p>{this.state.value}</p></h5>
    )}
    }

1 Ответ

3 голосов
/ 14 июля 2020

Это по-прежнему считается мутацией состояния ( огромный антишаблон! ). Игнорирование предупреждения не приводит к изменению поведения. Используйте обновление функционального состояния, чтобы взять существующее значение состояния, добавить к нему 1 и вернуть новый объект состояния, чтобы реагировать на изменение и обновить UI / DOM.

incrementWentWell() {
  this.setState(state => ({ value: state.value + 1 })
}

Edit response - регулярные и функциональные обновления состояния на основе классов

...