Для чего нужен UseState?

Для чего нужен UseState?

useState - это хук React, который позволяет добавлять состояние (state) в функциональные компоненты. Это одна из самых важных функций современного React.

Основное назначение

useState позволяет компоненту запомнить данные между рендерами. Каждый раз, когда состояние изменяется, компонент перерендеривается с новыми значениями.

const [count, setCount] = useState(0);

Синтаксис

const [value, setValue] = useState(initialValue);

value - текущее значение состояния setValue - функция для обновления состояния initialValue - начальное значение (опционально)

Простой пример

function Counter() {
  const [count, setCount] = useState(0);
  
  return (
    <div>
      <p>Счётчик: {count}</p>
      <button onClick={() => setCount(count + 1)}>
        Увеличить
      </button>
    </div>
  );
}

Управление различными типами данных

1. Простые значения (строки, числа, булевы)
2. Объекты и массивы
3. Функции-инициализаторы для сложных вычислений

Асинхронное обновление

Обновление состояния является асинхронным операцией. React батчирует несколько вызовов setState в один рендер для оптимизации производительности.

Функциональное обновление

Если новое значение зависит от старого, используй функцию:

setCount(prevCount => prevCount + 1);

Для объектов используй spread оператор

const [user, setUser] = useState({ name: 'John' });
setUser({ ...user, name: 'Jane' });

useState позволяет функциональным компонентам иметь локальное состояние, что делает их полностью эквивалентными классовым компонентам.