React Rainbow UI 示例缺少主题

问题描述

我正在尝试测试 Rainbow ui (https://react-rainbow.io/#/Sidebar) 中的侧边栏示例

    const SideBarContainer = styled.div.attrs(props => {
        return props.theme.rainbow.palette;
    })

但我收到了 props.theme.rainbow.palette 未解决的错误。我该如何解决这个问题？

解决方法

正如我在评论中所解释的，您需要将您的 React 应用程序包装在一个 Application 组件中，例如在 React Rainbow 的 doc 中解释：

export default function App() {
  return (
    <div className="App">
      <Application>
        <Header />
      </Application>
    </div>
  );
}

我做了一个React Rainbow sideBar demo的code SandBox，传入函数组件中：