Ответ
import React, { useState } from 'react';
function Counter() {
// Локальный стейт компонента
const [count, setCount] = useState(0);
const increment = () => setCount(prev => prev + 1);
const decrement = () => setCount(prev => prev - 1);
return (
<div>
<p>Count: {count}</p>
<button onClick={increment}>+</button>
<button onClick={decrement}>-</button>
</div>
);
}Локальный стейт лучше использовать когда:
- Данные нужны только в одном компоненте
- Нет необходимости делиться состоянием с другими компонентами
- Состояние простое и не требует сложной логики обновления
Redux стоит использовать для глобального состояния, которое нужно многим компонентам или требует сложных обновлений.
Ответ 18+ 🔞
Ну, представляешь, сидишь ты такой, пишешь компонент, и тут — бац! — надо ему своё собственное, интимное состояние. Ну, как у тебя в голове мысль: "А не пойти ли мне нахуй?". Вот для этого и есть useState, ебать мои старые костыли!
Смотри, как просто, аж пиздец:
import React, { useState } from 'react';
function Counter() {
// Локальный стейт компонента
const [count, setCount] = useState(0);
const increment = () => setCount(prev => prev + 1);
const decrement = () => setCount(prev => prev - 1);
return (
<div>
<p>Count: {count}</p>
<button onClick={increment}>+</button>
<button onClick={decrement}>-</button>
</div>
);
}Вот эта штука [count, setCount] — это как твои личные трусы. Только ты в них ковыряешься, и другим до них, в общем-то, похуй.
Так когда же эту локальную хуйню использовать, а когда бежать за Redux'ом?
Локальный стейт — твой выбор, когда:
- Данные нужны только этому компоненту, как тайная любовная записка, которую никому показывать не хочешь.
- Делиться этим состоянием с другими — ну нахуй не надо. Пусть живут своей жизнью.
- Всё просто, без этих ваших ебушки-воробушки с кучей редьюсеров и экшенов. Нажал кнопку — число изменилось. Красота!
А вот Redux — это уже ёперный театр. Тащи его, когда:
- Состояние должно быть глобальным, и к нему должны иметь доступ пол-приложения, как к холодильнику на общей кухне.
- Логика обновлений сложная, пиздец как. Не просто
+1, а "получил это, преобразовал то, отправил сюда, получил ошибку, откатил". - Компонентов много, и они все хотят одно и то же, а ты уже устал передавать пропсы через десять уровней вглубь, чувствуя себя идиотом.
Короче, если можно обойтись малыми силами — не выёбывайся. useState и так сойдёт. Зачем городить огород из connect, mapStateToProps и прочей хуйни, если твоему счётчику нужно только от нуля до десяти досчитать?