COMPONENT COMMUNICATION

- Communication component trong ReactJS là một khái niệm ám chỉ đến các thành
phần (component) trong ứng dụng ReactJS mà có khả năng truyền dữ liệu (data)
và tương tác (interaction) với các thành phần khác.
- Các communication component có thể là các thành phần cha (parent
components) hoặc các thành phần con (child components) và được sử dụng để
truyền dữ liệu và các hành động giữa các thành phần con và cha, hoặc giữa các
thành phần cùng cấp.
- Cách 1: từ component cha sang component con thông qua props

- Cách 2: truyền từ component con sang cha sử dụng callback

- Chúng ta sẽ tạo 1 callback ở component cha và gửi đến component con dưới
dạng props.
- Cách 3: sử dung Context. Context trong ReactJS là một cơ chế để truyền dữ liệu
từ component cha xuống component con một cách hiệu quả và tránh việc truyền
dữ liệu qua các props từng bước một từ component cha đến component con.
Context là một đối tượng JavaScript đại diện cho một phần của ứng dụng, được
lưu trữ tại một nơi duy nhất và có thể được truy cập từ bất kỳ component nào ở
bên trong cây component. Để sử dụng Context trong ReactJS, chúng ta cần định
nghĩa một Provider component (component cung cấp dữ liệu) để cung cấp dữ liệu
cho toàn bộ ứng dụng và một Consumer component (component tiêu thụ dữ liệu)
để sử dụng dữ liệu đó.