首页 文章

如何在react-native-router-flux中的选项卡之间共享状态?

提问于
浏览
1

所以我有一个使用react-native-router-flux的TabNavigation场景 . 我想在按下第二个选项卡时将状态从初始选项卡屏幕组件共享到第二个选项卡屏幕组件 . 做这个的最好方式是什么?

这是我的TabNavigation场景,其中包含两个子选项卡:

<Scene key="showPlaceTabBar" tabs={true} labelStyle={{fontSize: 20, marginBottom: 15}} hideNavBar>
                   <Scene key="postsTab" title="Posts"
                     onPress={()=> {Actions.posts()}}>
                     <Scene hideNavBar={false} key="showPlace" component={PlacesShow} title="Show Place" />

                   </Scene>

                   <Scene hideNavBar={false} key="createPostTab" title="Create Post"
                     onPress={()=> {Actions.createPost({placeName: this.props.placeName})}}>
                     <Scene key="createPost" component={CreatePost} title="Create Post" />

                   </Scene>
                 </Scene>

我想从PlacesShow组件向CreatePlace组件发送一些状态/道具数据 . Actions方法无法访问PlacesShow组件props / state,因为它存在于定义屏幕的位置 . 我该怎么做到这一点?

我已经研究过Redux,但我很难理解它究竟是做什么的 . 这是Redux的工作吗?我之前使用的是反应导航,但是很难自定义导航栏,当我切换到react-native-router-flux时,一切都变得容易了10倍 . 这基本上是我的应用程序所需的最后一段导航功能,并且宁愿不引入新库/切换回反应导航,除非我绝对必须(自定义导航组件很难理解,我很确定是我的应用程序需要什么) .

谢谢您的帮助 .

1 回答

  • 0

    AsyncStorage

    __

    由于您使用的是React-Native,因此可以使用 AsyncStorage interface来利用带下划线的设备的共享存储 .

    持续:

    await AsyncStorage.setItem('@MySuperStore:key', 'I like to save it.');
    

    检索:

    const value = await AsyncStorage.getItem('@MySuperStore:key');
    

    更多细节见the official documentation .

相关问题