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

Question

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

Answer 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）

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

React-navigation and custom left button onPress?

reactjs

react-native

react-navigation