React-native-navigation：goBack（）不起作用

Question

我在React Native中使用Redux的React Navigation。导航工作正常，但在一个屏幕上goBack（）函数不起作用。你能告诉我们为什么吗？

这是标头配置：

static navigationOptions = {
        header: ({ state, goBack }) => {
            return {
                title: state.params.name,
                right: (<Button
                    title={'Done'}
                    onPress={() => goBack()}
                />)

            }
        }
    }

这是派遣的事件：

没有弹出屏幕。设备上的屏幕保持不变。

Answer 1

试试<Button onPress={() => this.props.navigation.goBack(null)}>

当null用作输入参数时，它将带您进入最后一页（即时历史记录），当子导航器在堆栈中只有一个项目时，嵌套StackNavigators将返回父导航器。

他们将来可能会改变，因为根据他们的文档，有计划改变它。

有关更多信息，请查看here。

Answer 2

我想，如果你想使用goBack（）动作，你必须在你的View（不是标题）中使用这样的东西

<Button onPress={() => this.props.navigation.goBack()}>

Answer 3

我也有同样的问题。我不知道为什么但写goBack（null）对我有用：|

Answer 4

GoBack有点不稳定，明确地发布了对我有用的动作。

import { NavigationActions } from 'react-navigation';

this.props.navigation.dispatch(NavigationActions.back())

Answer 5

以下是github issue发布的工作解决方案：

setTimeout(this.props.navigation.goBack, 0)

显然这个错误是最近的回归。

Answer 6

这是一个解决方案。

这是我的工作代码： -

static navigationOptions = ({navigation, screenProps}) => {
     return {
         title:'SECOND',
         headerStyle:{ backgroundColor: '#ffffff'},
         headerTitleStyle:{fontSize:12},
         headerLeft:<TouchableOpacity onPress={()=>navigation.goBack()}>
                      <Image source={{uri:'back_btn'}} style={{height: 20, width: 20,marginLeft:10,}}/>
                  </TouchableOpacity>
     }
  }

Answer 7

根据这个github issue发布的解决方案。将null作为goBack函数的参数传递应该可以正常工作，就像它对我一样。 OP的情况下，以下代码应该有效：

static navigationOptions = {
        header: ({ state, goBack }) => {
            return {
                title: state.params.name,
                right: (<Button
                    title={'Done'}
                    onPress={() => goBack(null)}
                />)

            }
        }
    }

Answer 8

使用StackActions API打破了我的应用程序中的导航。通过导航到只有（更简单，更可靠）NavigationActions API的屏幕，后退按钮工作。

Answer 9

反应导航

<TouchableOpacity onPress={()=>{ this.props.navigation.goback() }}>
 <Text>Back</Text>
</TouchableOpacity>

反应天然路由器磁通

<TouchableOpacity onPress={() => { Actions.pop() }}>
 <Text>Back</Text>
</TouchableOpacity>