С обновлением React до версии 16.8.0 в феврале 2019 года была добавлена ​​возможность использования состояния в функциональных компонентах. Состояние — это объект JavaScript, управляемый функциональными компонентами, подобно переменной, объявленной в обычной функции.

Состояние следует использовать всякий раз, когда вам нужно отслеживать данные или свойства, которые могут измениться или обновиться между визуализациями. Изменение состояния — это то, что запускает повторную визуализацию или обновление компонента.

Состояние следует использовать внутри компонента, где это необходимо. Если это состояние требуется для нескольких компонентов, следует использовать самого последнего предка для обоих компонентов. Чтобы использовать состояние внутри функционального компонента, его необходимо вызвать или импортировать в верхней части компонента.

Чтобы инициализировать состояние, вы создаете деструктурированный массив, начальным значением которого является обновляемый элемент, а вторым значением является функция для обновления или изменения указанного значения.

const [thingToTrack, setThingToTrack]=useState('initialValue')

Изначально состояние может принимать любое значение: число, строку, логическое значение, объект или даже функцию. Для обновления или изменения состояния следует использовать функцию setState.

Вот ссылка на несколько примеров repl того, как можно использовать состояние:



Это всего лишь несколько примеров того, как обновить состояние. Вот ссылка на отличный пошаговый пример того, как создать приложение React и использовать состояние.