reactjs - 使用 useContext() 时不断遇到标准的 React 钩子错误。使用这个钩子有什么好的模式？

Question

我正在尝试使用 useContext() 钩子，但不断遇到标准的 React 钩子错误（例如，只能在函数内调用 Hooks，可能存在重复的 React 版本等）。认为这是我本地计算机上的配置问题，我尝试并成功在此沙箱中复制问题：https ://codesandbox.io/s/contextapi-hooks-wjvuk?file=/src/components/pages/主页.js

我已经阅读了一堆教程并在这里阅读了一些帖子，但没有一个成功的解决方案能指引我解决我的问题。

我相信我在实现中遗漏了一个小细节，因此任何帮助/建议，无论是实际的还是理论上的，以巩固我对 React 和 Context-API 的理解，将不胜感激。

干杯!

标签： reactjsreact-context

Answer 1

您只能在组件内部使用钩子。目前，您的Home函数并未在任何地方用作组件，因此您无法useContext在其中使用。尝试替换这一行：

<Route exact path="/" render={Home} />

和：

<Route exact path="/"><Home /></Route>