是否有任何解决方案可以从其他组件更新 react-native-router-flux 中的 Drawer

Question

我正在尝试在 react-native-router-flux 中创建一个动态抽屉。 我的意思是，当我更改场景抽屉时，可以检测现在激活的场景，并可以通过新数据进行自我更新。 我的抽屉里有一个调用 App.js 的组件

<Drawer
    key={'drawer'}
    contentComponent = {() => <DrawerLayout language={this.state.language} />}
    drawerPosition= {this.state.rightOrLeft}

    <Stack key={'root'} hideNavBar>
        <Scene key={'splash'} component={Splash} initial/>
        <Scene key={'login'} component={Login} />
        <Scene key={'home'} component={Home} />
        <Scene key={'about'} component={About} />
    </Stack>
</Drawer>

我希望我能正确解释我的梦想！！！

Answer 1

如果您使用的是 redux，您可以保留状态并从存储中获取当前场景并进行操作。

如果你没有使用 redux，你仍然可以在没有它的情况下使用它。一种选择是执行以下操作：

1. 在 DrawerNavigator 中使用 contentComponent 并从单独的 js 文件中获取内容。

   contentComponent: props => <SideBar {...props} />

2. 现在您需要在 App.js 名称中声明全局变量为 currentScene 并将您的主页设置为默认值。

3. 现在让我们加入 sideBar.js 中，点击每个菜单项将全局变量值更改为所选菜单。

4. 根据 SideBar.js 中当前场景的值更改 menuItems 列表。

一个很好的例子是 React Native Base Kitchen Sink 示例应用。一旦熟悉了它，请按照四个步骤阅读其中的代码，然后就完成了。

https://github.com/GeekyAnts/NativeBase-KitchenSink