在reactjs功能组件中实现contextType的正确方法是什么？

Posted 2021-03-27

在reactjs 16 ...版本中，添加了contextType属性，并且还鼓励使用功能组件。但出于某种原因，似乎没有关于将它们一起使用的任何文件。找到的唯一示例是在与类组件的组合中使用contextType的示例。有没有人有一个在功能组件结构中使用contextType的例子？

答案

使用useContext()钩子。来自React文档：

小费

如果您在Hooks之前熟悉上下文API，则useContext(MyContext)等同于类中的static contextType = MyContext或<MyContext.Consumer>。

useContext(MyContext)只允许您阅读上下文并订阅其更改。您仍然需要树中的<MyContext.Provider>来为此上下文提供值。