反应导航和自定义左键onPress？答案

【问题标题】：React-navigation and custom left button onPress?反应导航和自定义左键onPress？
【发布时间】：2017-05-29 21:52:06
【问题描述】：

我想在react-navigation 中创建一个自定义left 按钮。我需要这个left 按钮的onPress 事件才能转到特定屏幕；我该怎么做呢？理想情况下，我不想编写自己的 redux 导航，因为这变得很复杂。我可以在没有 redux 的情况下做到这一点吗？

【问题讨论】：

标签： reactjs react-native react-navigation

【解决方案1】：

很容易得到这个，试试这个：

const stackNavigatorConfiguration = {
  // set first Screen
  initialRouteName: 'Login',
  // headerMode: 'none'(disable header)
  // style of switching screens(options: modal/card)
  mode: Platform.OS === 'ios' ? 'card' : 'card',
  navigationOptions: ({navigation}) => ({
    headerRight: <DrawerButton navigation={navigation} />,
    headerBackTitle: null,
    headerStyle: {
      backgroundColor: '#282b3a'
    },
    headerTitleStyle: {
      color: 'white'
    },
    // color of the back button
    headerTintColor: 'white',
    headerBackTitleStyle: {
      color: 'white'
    }
  })
}

...

const DrawerButton = ({ navigation }) => (
  <TouchableOpacity>
    <Ionicons
      style={styles.drawerIcon}
      name='ios-menu-outline'
      size={32}
      onPress={() => navigation.navigate('DrawerOpen')}
    />
  </TouchableOpacity>
)

您可以使用 navigationOptions - headerRight 定义您的按钮在那里你导入一个组件（参见 DrawerButton）

【讨论】：