javascript - 如何在 blueprintjs v3 的反应应用程序中为所有子组件切换主题（明暗）？

Question

我正在编写一个反应应用程序，需要一种在暗模式和亮模式之间切换的方法。我在 blueprintjs 文档中找不到任何文档，其中提到了如何使用某些父道具配置更改所有子组件的主题。

Answer 1

在你的根容器中使用类名.bp3-dark ，如下所示。

Blueprint 提供了两种 UI 颜色主题：浅色和深色。默认情况下，浅色主题处于活动状态。可以通过将类 bp3-dark 添加到容器元素来应用深色主题，以对所有嵌套元素进行主题化。

import React from 'react';

import {Navigation} from "./Navigation";
import Main from "./Main";

const App = () => (
    <div className="bp3-dark">
      <Navigation />
      <Main />
    </div>
  );

export default App;