react-native - React Native (React Navigation) 将数据从一个屏幕传递到另一个使用

Question

我有一个使用 Ignite CLI 创建的 React Native 应用程序.我正在尝试将 TabNavigator 与 React Navigation 结合使用，但我似乎无法弄清楚如何将数据从一个屏幕传递到另一个屏幕。我见过的所有例子都展示了如何在点击按钮和使用 onPress 时传递数据。功能，但在我的情况下，当我实际点击其中一个选项卡按钮时，我需要/想要传递数据，而且我还没有找到关于如何做到这一点的解释，至少是我理解的解释。

我有两个用户将与之交互的屏幕 SearchScreen和 WatchScreen .这两个屏幕由 AppNavigation.js 中的 TabNavigator 控制。文件。所以一共有3个文件AppNavigation.js , SearchScreen.js和 WatchScreen.js .
AppNavigation.js

import { StackNavigator,TabNavigator } from 'react-navigation'
import SearchScreen from '../Containers/SearchScreen'
import WatchScreen from '../Containers/WatchScreen'
import SearchWatch from '../Containers/SearchWatch'
import LaunchScreen from '../Containers/LaunchScreen'
import styles from './Styles/NavigationStyles'

const PrimaryNav = TabNavigator({
  Search: { screen: SearchScreen },
  Watch: { screen: WatchScreen }
}, {
  initialRouteName: 'Search',
  lazy: true,

})
export default PrimaryNav

SearchScreen将获取一些数据并将其保存在一个数组中，我需要在 WatchScreen 中可用。以及。通常我会将数据作为 Prop 传递给 WatchScreen，但是使用 TabNavigator 我看不出如何做到这一点，因为它不是 SearchScreen 的 child .在`SearchScreen 中，相关的部分是这个

constructor(props){
  super(props)
  this.state = { movies: []}
}

this.state.movies是我需要在我的 WatchScreen 中可用的东西，我怎样才能使它在我点击 Watch 时可用标签栏中的按钮？

我读过的内容表明每个 Screen组件以 this.props.navigation 的形式传递导航 Prop 或 this.props.screenProps ，这会是我通过 movies 的方式吗？数组到我的 WatchScreen ?如果是这样， this.props.navigation & this.props.screenProps似乎没有传递到我的 WatchScreen。

Answer 1

发送数据

 onPress={() => this.props.navigation.navigate(
                SCREEN_NAME,
                {
                    item: YOUR_DATA_WHAT_YOU_NEDD_TO_SEND
                }
            )}

接收数据

  const item = this.props.navigation.getParam('item');