Trình chọn và Hook useSelector trong Redux

Ở các bài học trước, chúng ta đã lưu dữ liệu sản phẩm vào store. Vậy làm thế nào để lấy chúng ra từ store?

Để làm điều đó, chúng ta cần viết một hàm trình chọn. Hàm này biết cách trích xuất một phần thông tin cụ thể từ giá trị trạng thái được lưu trữ trong store và giúp tránh việc viết mã lặp lại khi ứng dụng phát triển. Hàm này nhận đầu vào là state, và đầu ra là slice trạng thái cần thiết. Ví dụ:

Ngay từ đầu sách giáo khoa đã đề cập rằng, store có phương thức getState. Và chúng ta có thể dễ dàng sử dụng nó để lấy giá trị trạng thái:

Vấn đề nằm ở chỗ, các component React của chúng ta không thể truy cập trực tiếp vào store, vì không được phép import nó vào file component. Nhưng chúng ta có khả năng lấy dữ liệu trong component bằng cách sử dụng hook useSelector của React-Redux. Hơn nữa, với hook này, các component của chúng ta sẽ luôn nhận được dữ liệu cập nhật nhất: