【问题标题】:Back button not working in react native navigation后退按钮在本机导航中不起作用
【发布时间】:2017-09-07 12:30:13
【问题描述】:

我正在使用本机导航,我需要更新通过以下代码实现的后退按钮设计

static navigationOptions = {
    title: '',
    headerStyle: {
      backgroundColor: '#544849',
    },
    tintColor: 'transparent',
    headerLeft: <TouchableOpacity onPress={() => this.props.navigation.goBack()}><Image source={require('../../img/close.png')} style={{marginTop: 10, marginLeft:10}} /></TouchableOpacity>
  };

但是这样我得到错误 undefined is not an object(evalating r.props.navigation)

如果没有 onPress,后退按钮什么都不做。

【问题讨论】:

  • 您使用的是react-native-navigation 还是react-navigation?您的代码看起来像后者。
  • @MichaelCheng "react-navigation": "^1.0.0-beta.11"
  • @AdnanAli 能否提供该视图的完整代码。
  • 我使用反应导航。它没有在发布版本的顶部显示按钮。但模拟器和真 iPhone 都可以。
  • 我使用 createStackNavigator

标签: reactjs react-native react-navigation


【解决方案1】:

根据docs for NavigationOptions,您可以像下面这样更改您的代码。

static navigationOptions = ({ navigation, screenProps }) => ({
        title: '',
        headerStyle: {
          backgroundColor: '#544849',
        },
        tintColor: 'transparent',
        headerLeft: <TouchableOpacity onPress={() => navigation.goBack()}><Image source={require('../../img/close.png')} style={{marginTop: 10, marginLeft:10}} /></TouchableOpacity>
});

【讨论】:

  • 感谢 bennygenel 的有效回答。不知道首先投了反对票。 :D
猜你喜欢
  • 1970-01-01
  • 2015-12-16
  • 2020-11-22
  • 2020-05-07
  • 2013-07-26
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多