javascript - 如何将 mapStateToProps/redux 添加到 react-navigation TabNavigator?

标签 javascript react-native react-router react-navigation tabnavigator

我想构建此处显示的非常简单的示例:https://reactnavigation.org/docs/tab-based-navigation.html

import React from 'react';
import { Text, View } from 'react-native';
import { TabNavigator } from 'react-navigation'; // 1.0.0-beta.27

class HomeScreen extends React.Component {
  render() {
    return (
      <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
        <Text>Home!</Text>
      </View>
    );
  }
}

class SettingsScreen extends React.Component {
  render() {
    return (
      <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
        <Text>Settings!</Text>
      </View>
    );
  }
}

export default TabNavigator({
  Home: { screen: HomeScreen },
  Settings: { screen: SettingsScreen },
});

我将如何在 mapStateToProps(或任何堆栈导航器)中包装选项卡导航器。例如,如果我想为特定选项卡使用动态选项卡名称。

谢谢。

最佳答案

 const MainRoot =(props) => {
      const myTabbar = TabNavigator({
              Home: LoginForm,
              Settings: RegistrationForm,
              third: TabsView
               },{
               initialRouteName: props.myName
               }
             );
       return <CustomTabNavigator/>;
 }
 const mapStateToProps = state => ({
          myName: state.LibraryMain,
 });
export default connect(mapStateToProps)(MainRoot)

关于javascript - 如何将 mapStateToProps/redux 添加到 react-navigation TabNavigator?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49010848/

相关文章:

javascript - JS-动态创建表

Javascript:如何通过单击按钮执行操作?

javascript - window.click 不会在 iPad 的 Safari 上触发

react-native - 如何使用 expo react native 预加载视频

android - react native 应用程序图标问题。应用程序菜单中的应用程序图标未更改

javascript - jQuery + CSS : How to detect the first "move out" of cursor out of an element?

react-native - 使用 React Native 和 Redux 存储离线存储数据并在线同步一次

javascript - 解析错误: Unexpected token = ReactJs

javascript - 是否可以从未导入 withRouter 的文件设置组件路由?

reactjs - React 路由器更改 url 而不重新加载页面