React native 导入已创建的redux存储以从未连接的组件分派操作

我正在使用react native和redux。我也在使用react导航，我有一个底部选项卡导航器，其中第二个RouteConfig导航选项为tabBarOnPress提供了一个功能。我想在这个回调中向redux发送一些操作

import store from "./Store"    

const BottomTab = createBottomTabNavigator(
    {
        First: FirstScreen,
        Second: {
           screen: SecondScreen,
           navigationOptions: {
               tabBarOnPress: ({ navigation }: any) => {
                   store.dispatch(someAction())
                   navigation.navigate("SecondScreenModal");
               }
           }
        },
        Third: ThirdScreen
    },
    {
        navigationOptions: ({ navigation }) => ({
        //..
    }
);

由于我找不到连接底部选项卡导航器的方法，我想知道在这种情况下直接导入创建的redux存储（与我作为道具传递给提供者的存储相同）是否是一种不好的做法

---

在

const BottomTab=createBottomTabNavigator（）

这个完整的代码箱

mapStateToProps

之后，

mapDispatchToProps

箭头函数

    export default connect(mapStateToProps, mapDispatchToProps)(BottomTab);

---

我相信您希望这样做。

在您希望调度redux操作的屏幕内（在您的情况下是SecondScreen），设置一个与您希望执行的函数相等的导航参数。您可以为参数命名任何名称，但我通常根据我将如何使用它来命名它

componentDidMount = () => {
  this.props.navigation.setParams({ tabBarOnPress: this.props.myReduxActionCreator })
}

然后在屏幕导航选项中，您可以执行类似操作来访问该功能。确保上面的参数名称相同，因此在这个exmaple中，'tabBarOnPress'

const BottomTab = createBottomTabNavigator(
  {
    First: FirstScreen,
    Second: {
      screen: SecondScreen,
      navigationOptions: {

        // Access the function inside navigation params here
        tabBarOnPress: ({navigation}) => navigation.getParam('tabBarOnPress', null)
      }
    },
    Third: ThirdScreen
  },
  {
    navigationOptions: ({navigation}) => ({})
  }
)

---

createBottomTabNavigator（）是一个返回组件的函数，它接受两个参数RouteConfig和NavigationOptions。您希望如何在导航选项中访问this.props.dispatch:{tabBarOnPress:（{navigation}:any）=>{store.dispatch（someAction（））navigation.navigate（“SecondScreenModal”）；}？这是一个很好的答案，可以解决我关于react导航的问题。但是，如果直接使用导出的存储而不是传统的提供者/连接方式是一种不好的做法，那么这并不能真正解决问题。你能不能也精确点？实际上我的参数没有定义，第一屏和第三屏是StackNavigator，这可能是个问题吗？

const BottomTab = createBottomTabNavigator(
  {
    First: FirstScreen,
    Second: {
      screen: SecondScreen,
      navigationOptions: {

        // Access the function inside navigation params here
        tabBarOnPress: ({navigation}) => navigation.getParam('tabBarOnPress', null)
      }
    },
    Third: ThirdScreen
  },
  {
    navigationOptions: ({navigation}) => ({})
  }
)