Подтвердить что ты не робот

React setState + Откуда берется "prevState"?

Я только начал изучать React и JavaScript.
Просматривая учебник, я добрался до этого примера кода компонента, который создает кнопку переключения.
Это часть кода:

class Toggle extends React.Component {
    constructor(props) {
        super(props);
        this.state = {isToggleOn: true};
        this.handleClick = this.handleClick.bind(this);
    }

    handleClick() {
        this.setState(prevState => ({    // prevState?
            isToggleOn: !prevState.isToggleOn
        }));
    }

2 вещи, которые прослушивают меня здесь:

  • Откуда появился аргумент prevState?
    Я не вижу ничего подобного var prevState = this.state;, прежде чем вызывать его, и все же он работает.
  • Синтаксис функции стрелки: почему скобки после стрелки?
    Почему здесь не работает обычный синтаксис arg => { statement; }?

Извините за вопросы новичков...

4b9b3361

Ответ 1

  1. prevState обеспечивается React наряду с props, оба из которых являются необязательными.

    • Обновление 04/13/19: React изменило функцию документацию SetState переименования prevState к updater. Функция обратного вызова все еще принимает два аргумента; state и props во время применения изменения.
  2. Круглые скобки допускают несколько строк, где, если вы не используете круглые скобки, вы будете вынуждены использовать return. Вы можете использовать одну строку, но вам не нужны фигурные скобки.

    • Обновление: я забыл упомянуть конкретный случай, когда требуется иметь круглые скобки. Если вы возвращаете объект без оператора return вы должны заключить его в скобки. Спасибо @joedotnot за то, что поймали это. Поэтому () => {foo: true} выдаст ошибку, потому что она выглядит как функция, а foo: true - недопустимая строка. Чтобы это исправить, он должен выглядеть так () => ({ foo: true })