Higher-Order Components (HOC) trong React JS

Higher-Order Components (HOC - tạm dịch là các Component cao cấp hơn) là 1 kỹ thuật nâng cao của React để sử dụng lại logic của component. HOCs không phải là 1 phần của React API. Nó là một mô hình được phát triển tử bản chất React

Cụ thể

Một HOC là 1 HÀM CÁI MÀ NHẬN VÀO 1 COMPONENT VÀ TRẢ VỀ 1 COMPONENT MỚI

(Component này chủ yếu sẽ thêm các props, dữ liệu hoặc gán thêm các sự kiện chung chứ không được thay đổi logic) kiểu như

const EnhancedComponent = higherOrderComponent(WrappedComponent);

Trong phần tiếp theo chúng ta sẽ thảo luận xem vì sao HOC lại hữu ích và viết nó như thế nào.

Bài toán đặt ra là có một giá trị userContext là ta cần thêm nó vào một component X nào đó. Cách thông thường chúng ta nghĩ tới sẽ là sử dụng cú pháp context trong React thôi