Which is the correct way to consume context in a functional component using the "useContext" hook?

4 phương ánCó giải thích

Các phương án trả lời

Chọn một phương án
Lời giảiChọn phương án để mở

Đáp án đúng: "const value = useContext(MyContext);". Hook useContext nhận chính đối tượng context được tạo bởi createContext và trả về giá trị của Provider gần nhất phía trên component trong cây; khi giá trị Provider đổi, component đang đọc nó sẽ render lại. Vì vậy trong function component ta gọi useContext(MyContext) ở cấp cao nhất của hàm rồi gán kết quả vào biến. Phương án "const value = MyContext();" gọi đối tượng context như một hàm, nhưng context là đối tượng chứ không phải hàm nên sẽ ném lỗi TypeError. Phương án "const value = this.context(MyContext); " mượn cách của class component, nhưng ở class this.context là một thuộc tính (dùng cùng static contextType) chứ không phải hàm để gọi, và function component cũng không có this. Phương án "

Lời giải
<MyContext.Provider useContext={
  value
}
/>

" là phía cung cấp chứ không phải phía đọc: Provider nhận giá trị qua prop value, không có prop tên useContext, và viết vậy không đọc được gì vào component.

Cùng phần 6

Xuất hiện trong 1 bộ đề