我如何使用另一个文件中函数内的函数？

Question

我想为我的 React 应用程序设置一个深色和浅色主题。我的 Sidebar.js、Header.js 和 Footer.js 文件位于 src 文件夹内的 Components 文件夹中。 我的应用程序默认加载浅色主题，切换开关位于侧边栏中。如果我尝试切换到深色主题，只是侧边栏和正文切换，页眉和页脚仍保持浅色主题。

侧边栏.js

//Sidebar.js
const Sidebar = () => {
  const [theme, setTheme] = useState(lightTheme);
  const toggleTheme = () => {
    setTheme(prevTheme => (prevTheme === darkTheme ? lightTheme : darkTheme));
  };
  
  return (
    <SubMenuItem as="div" onClick={toggleTheme}>
      {theme === darkTheme ? 'Light Theme' : 'Dark Theme'}
    </SubMenuItem>

如何获取页眉和页脚以获取 ToogleTheme 的状态？

Answer 1

好吧，您可以使用 Context API（React 中专用）创建 Context，并创建一个 ThemeContext 和 ThemeContextProvider，然后用它包装您的组件并将该状态传递到您想要的任何地方。

您可以按照此链接的描述来了解您需要做什么： 完成此任务的一些方法...