Bạn quản lý state trong ứng dụng React Native như thế nào?

Question

Accepted Answer

Quản lý state trong React Native (như trong React) trải dài từ state component cục bộ (useState) đến state chia sẻ/toàn cục qua **Context**, hoặc các thư viện như **Redux**, **Zustand**, và những thứ khác. Hiểu các lựa chọn và khi nào dùng mỗi cái là quan trọng khi app lớn lên.

## State cục bộ và lifting state up

```text
useState → state component cục bộ (đơn giản, cho một component)
LIFTING STATE UP → di chuyển state chia sẻ lên một component cha chung, truyền xuống qua props
  → hoạt động cho chia sẻ ở mức vừa phải, nhưng "PROP DRILLING" (truyền qua nhiều lớp) gây phiền
```

## Context API — state chia sẻ tích hợp sẵn

```jsx
// Context chia sẻ state xuyên cây mà KHÔNG cần prop drilling (tích hợp sẵn trong React)
const ThemeContext = createContext();
// cung cấp nó ở cao trong cây; tiêu thụ bằng useContext ở bất kỳ đâu bên dưới
const theme = useContext(ThemeContext);
// → tốt cho dữ liệu toàn cục tần suất thấp (theme, auth, user); có thể gây re-render nếu lạm dụng
```

## Thư viện quản lý state

```text
Với state phức tạp/toàn cục, các thư viện giúp ích:
  REDUX (+ Redux Toolkit) → store tập trung dễ dự đoán; có cấu trúc; phổ biến cho app lớn;
    nhiều boilerplate hơn (RTK giảm bớt)
  ZUSTAND → store tối giản, đơn giản, dựa trên hook — lựa chọn nhẹ hiện đại phổ biến
  Jotai / Recoil → state nguyên tử; MobX → state observable
  React Query / TanStack Query → cho SERVER state (cache, fetch) — thường dùng kèm
    (xử lý dữ liệu API, loading, cache)
```

## Lựa chọn

```text
Đơn giản/cục bộ → useState; chia sẻ vừa phải → lift up / Context
State toàn cục phức tạp → Redux Toolkit hoặc Zustand (theo sở thích/độ phức tạp)
Dữ liệu server/API → React Query (cache, sync) — khác với client state
→ Đừng over-engineer; khớp giải pháp với độ phức tạp của app.
```

## Tại sao điều này quan trọng

Hiểu quản lý state là quan trọng vì **cách một app quản lý và chia sẻ state là một mối quan tâm kiến trúc đáng kể** vốn tăng theo độ phức tạp của app, nên đây là kiến thức có giá trị để xây dựng app React Native thực tế.

Quản lý state trong React Native hoạt động như React, trải từ đơn giản đến tinh vi.

Hiểu **state cục bộ** (useState) và **lifting state up** (di chuyển state chia sẻ lên một component cha chung) bao quát nhu cầu cơ bản, trong khi nhận ra **vấn đề prop-drilling** (truyền state qua nhiều lớp trở nên phiền) thúc đẩy các giải pháp tốt hơn. **Context API** (cách tích hợp sẵn của React để chia sẻ state xuyên cây mà không cần prop drilling) tốt cho dữ liệu toàn cục tần suất thấp (theme, auth, user hiện tại), tuy có thể gây re-render nếu lạm dụng.

Hiểu **các thư viện quản lý state** cho state phức tạp/toàn cục — **Redux** (với Redux Toolkit, một store tập trung dễ dự đoán, có cấu trúc và phổ biến cho app lớn), **Zustand** (tối giản, đơn giản, dựa trên hook, một lựa chọn nhẹ hiện đại phổ biến), và những thứ khác (Jotai, MobX) — cung cấp các lựa chọn để quản lý state lớn của app.

Quan trọng là hiểu **React Query/TanStack Query cho server state** (cache và sync dữ liệu API, khác với client state) phản ánh nhận thức hiện đại rằng **server state và client state là hai mối quan tâm khác nhau** (dữ liệu API với cache/fetch thường tốt nhất nên được xử lý riêng) — một sự phân biệt có giá trị, ngày càng quan trọng.

Hiểu cách **lựa chọn** (useState cho cục bộ, Context cho chia sẻ vừa phải, Redux Toolkit hoặc Zustand cho state toàn cục phức tạp, React Query cho dữ liệu server, mà không over-engineer) phản ánh phán đoán đúng đắn khớp giải pháp với độ phức tạp.

Vì quản lý state là một mối quan tâm kiến trúc đáng kể ảnh hưởng đến khả năng bảo trì và mở rộng theo độ phức tạp của app, và vì hiểu phổ (state cục bộ, Context, thư viện, và sự phân biệt server-vs-client-state) cùng lựa chọn phù hợp là quan trọng để xây dựng app thực tế, hiểu quản lý state trong React Native là kiến thức có giá trị, liên quan thực tiễn — một lĩnh vực kiến trúc then chốt để xây dựng app React Native dễ bảo trì, mở rộng được, với các lựa chọn và sự phân biệt client/server-state là quan trọng cho kiến trúc state đúng đắn.