react-native - react 导航back()和goBack()不起作用

我正在尝试返回两个屏幕。目标是从EditPage变为Cover。这是我的导航堆栈:
Main -> Cover -> EditCover -> EditPage
我阅读了文档，并说要提供您要返回的屏幕的键，这是我的代码:

this.props.navigation.dispatch(NavigationActions.back({key: 'EditCover'}));

我也尝试过(没有运气):

this.props.navigation.dispatch(NavigationActions.back('EditCover'));
this.props.navigation.dispatch(NavigationActions.back({key: 'EditCover'}));
this.props.navigation.dispatch(NavigationActions.back({routeName: 'EditCover'}));
this.props.navigation.goBack('EditCover');
this.props.navigation.goBack({key: 'EditCover'});
this.props.navigation.goBack({routeName: 'EditCover'});

关于这一切的有趣的事情是我没有错误。调用代码没有任何反应...

附言如果我只想返回一个屏幕，则此代码可以正常工作:

this.props.navigation.goBack(null);

P.S.S.如果有人在解决方案之前遇到了这个问题。此hack目前可以使用:

this.props.navigation.goBack(null);
this.props.navigation.goBack(null);

最佳答案

key 的goBack()属性是一个动态创建的字符串，只要它导航到新路线，就由react-navigation创建。

例如:


它存储在 this.props.navigation.state.key 中。

因此，如果您想从EditPage转到Cover，您要做的就是将EditCover的密钥向下传递给EditPage，然后使用该密钥调用goBack()。

为什么不是Cover的键而是EditCover？

由于react-navigation仅提供 goBack(key) 方法，因此它是从键返回，而不是返回到键。



EditCover.js

render() {
    const { state, navigate } = this.props.navigation;

    return (
        <View>
            <Button title="Go to Page" onPress={ () => {
                /* pass key down to *EditPage* */
                navigate('EditPage', { go_back_key: state.key });
            }} />
        </View>
    );
}

EditPage.js

render() {
    const { state, goBack } = this.props.navigation;
    const params = state.params || {};

    return (
        <View>
            <Button title="Back to Cover" onPress={ () => {
                /* go back from *EditCover* to *Cover* */
                goBack(params.go_back_key);
            }} />
        </View>
    );
}