使用 native-base 动态更改主题

Question

我正在尝试在应用程序中实现深色主题。 我目前被告知使用 native-base 来实现这一点。 我可以成功切换主题，但需要我重新加载应用程序才能产生任何影响。

我的主题更改逻辑是在应用程序级别

<StyleProvider style={ getTheme(this.state.theme === 'light' ? platform : darkplatform) }>

随着主题在模块级状态下像这样重新渲染

    console.log(`darkTheme enabled? ${isDarkThemeEnabled}`);
    if (isDarkThemeEnabled && this.state.theme === 'light') {
      this.setState(() => ({
        theme: 'dark',
      }));
    } else if (!isDarkThemeEnabled && this.state.theme === 'dark') {
      this.setState(() => ({
        theme: 'light',
      }));
    }
  };

我知道这不是理想的逻辑，但根据我放置在 app.js 渲染方法中的控制台日志，它正在重新渲染并且主题正在样式提供程序中切换。 应用程序中的其余组件成功实现了原生基础，它们使用当前主题，但只有在应用程序刷新后才会切换。 我还确保它们都在状态更改时重新渲染，但主题保持不变

更新：一些组件会即时更改，但不是全部。 这有什么原因吗？ 似乎是随机的，我的一些视图标签正在改变，但不是全部，甚至不是所有的都在同一个组件中

编辑：我正在使用 redux，我的所有组件都在状态更改时重新渲染，但奇怪的是只有一些主题发生了变化

Answer 1

我最终是如何修复它的（有点）：

运行 npm i --save git+ https://github.com/GeekyAnts/theme

必须这样做，因为主题的 npm 版本没有 clearThemeCache();

在我的 app.js 中

添加了import { clearThemeCache } from 'native-base-shoutem-theme';

和clearThemeCache(); 到在黑暗主题更改时更新组件状态的方法

从这里开始，我不得不在黑暗主题切换下重新渲染整个应用程序中的每个组件，因为某些 nativebase 组件没有在黑暗主题更改时重新渲染