React native 在不重置应用程序的情况下动态更改颜色和图标

在我的应用程序中，我使用了这样一个主题化系统

我有一个

Images.js

文件，其中包含带有requires的对象。顺便说一句，我使用图像文件作为图标

例如，对于标题，我有如下内容：

const-imagesHeader={back:require（“path/back_-icon.png”）、next:require（“path/next_-icon.png”）}

等等

但现在我还需要一个黑暗的主题。为此，我在我的

app

store中保存了一个可观察变量。顺便说一句，我使用

MobX

进行状态管理。我有一个名为app的商店，我有一个名为theme的可观察变量，如下所示：

@persist@observable theme=“light”

，默认情况下它的值是

light

但是，在RN中，我意识到，一旦你在初始化组件时需要一个图标作为图像，你就不能在不重置应用程序的情况下动态更改它。 为此，我决定将每个图像

getter函数

设置为：

首先，我在一个名为

allImages

const allImages = { 
   light mode ->     light:{
                            back: require("path/light/back_icon.png"),
                            next: require("path/light/next_icon.png")},
   dark mode ->      dark:{
                            back: require("path/dark/back_icon.png"),
                            next: require("path/dark/dark/next_icon.png"),
                };

在那之后，我从我的存储中获取变量，然后像这样返回

   const getTheme = () => getStores().app.theme; <- returns "light/dark" (string)

我对颜色也遵循同样的逻辑，不仅仅是图标图像。我为每一种颜色创建了getter方法，就像我在这里为每一个图标创建getter一样

但现在的问题是，我认为它试图在存储实际初始化之前，从存储中获取我的

theme

变量。 因为我总是在类/功能组件之外创建样式定义。但是当实际组件初始化时，

MobX

存储初始化，这意味着当组件初始化时，我可以达到

主题

值。否则我会得到

主题未定义的错误。
我也为此做了一些研究，并找到了一种方法，所以如果我将
样式
定义转换为函数，它实际上是在等待组件初始化。
如您所知，通常我们是这样定义样式的：

const styles = StyleSheet.create({});

这不管用

const styles = () => StyleSheet.create({});

这是有效的。
但是，如果我转换整个项目中的所有样式（包含600多个文件），我需要在标记中使用样式，例如
styles（）。something
，而不是
styles.something

事实上，一切正常，但我的主要问题是想从你那里得到更好的想法，因为我不想花时间编辑600多个文件：(

如果有更好的方法来处理这个问题，或者有没有方法在组件出现之前初始化my
MobX
存储，那就太好了。
或者也许有更好的逻辑来处理这些事情

谢谢大家!

const styles = () => StyleSheet.create({});