Cách thức hoạt động của ứng dụng Redux

Bây giờ, được trang bị các thuật ngữ, chúng ta có thể xem xét ngắn gọn các giai đoạn chính trong hoạt động của một ứng dụng Redux, mà bạn sẽ tạo ra sau này.

Ứng dụng hoạt động theo nguyên lý dữ liệu luân chuyển một chiều, như chúng ta đã đề cập trước đó.

Ở giai đoạn khởi tạo (khi ứng dụng chạy lần đầu tiên) thông qua root reducer, một kho lưu trữ (store) được tạo ra. Kho lưu trữ gọi reducer này chỉ một lần và ghi lại giá trị mà nó trả về làm trạng thái ban đầu. Khi render lần đầu, các component của ứng dụng sử dụng state hiện tại, được lưu trong kho. Chúng cũng đăng ký nhận cập nhật từ kho lưu trữ, để ngay lập tức biết về sự thay đổi của state.

Trong quá trình hoạt động tiếp theo của ứng dụng, điều sau đây xảy ra. Giả sử người dùng đã nhấp chuột vào một nút. Trong trường hợp này, bằng mã lệnh, một action được tạo ra, nó được gửi đến kho lưu trữ. Kho lưu trữ một lần nữa chạy reducer với state đang được lưu trữ trong nó và action nhận được. Kết quả là giá trị state đã thay đổi được lưu lại làm giá trị mới. Đồng thời kho lưu trữ thông báo cho các component đã đăng ký nhận thay đổi về việc đã có sự thay đổi. Đến lượt mình, các component kiểm tra xem các phần state cần thiết cho chúng có bị thay đổi hay không. Cuối cùng, nếu có thay đổi, thì component sẽ kích hoạt việc render để hiển thị dữ liệu mới.