Javascript 返回到特定屏幕，而不是第一个屏幕

当我点击后退按钮或执行

this.props.navigation.goBack（）

时，我返回到我的第一个屏幕，而不是第一个屏幕

下面是我的App.js，我的导航器是如何实现的：

export default class App extends React.Component {
  render() {
      const MainNavigator = createAppContainer(createBottomTabNavigator({
          info: {
          screen: CtrlInfoStart,
          navigationOptions: { tabBarVisible: false }
      },
          mascotChoice: {
          screen: CtrlMascotChoice,
          navigationOptions: { tabBarVisible: false }
      },
          optionScreen: {
          screen: CtrlOptions,
          navigationOptions: { tabBarVisible: false }
      },
          welcomeScreen: {
          screen: CtrlWelcome,
          navigationOptions: { tabBarVisible: false }
      },
          preview: {
          screen: CtrlPreviewMap,
          navigationOptions: { tabBarVisible: false }
      },
          map: {
          screen: CtrlMap,
          navigationOptions: { tabBarVisible: false }
      },
          pointOfInterest: {
          screen: CtrlPI,
          navigationOptions: { tabBarVisible: false }
      },
          quizz: {
          screen: CtrlQuizz,
          navigationOptions: { tabBarVisible: false }
      }
      }));

    return (
    <View style={styles.container}>
        <MainNavigator/>
    </View>
    );
  }
};

导出默认类App扩展React.Component{
render（）{
const MainNavigator=createAppContainer（createBottomTabNavigator({
信息：{
屏幕：CtrlInfoStart，
导航选项：{tabBarVisible:false}
},
马斯科特选择：{
屏幕：CtrlMascotChoice，
导航选项：{tabBarVisible:false}
},
选项屏幕：{
屏幕：Ctroptions，
导航选项：{tabBarVisible:false}
},
欢迎光临：{
屏幕：CtrlWelcome，
导航选项：{tabBarVisible:false}
},
预览：{
屏幕：CtrlPreviewMap，
导航选项：{tabBarVisible:false}
},
地图：{
屏幕：CtrlMap，
导航选项：{tabBarVisible:false}
},
兴趣点：{
屏幕：CtrlPI，
导航选项：{tabBarVisible:false}
},
测验：{
屏幕：CtrlQuizz，
导航选项：{tabBarVisible:false}
}
}));
返回(
);
}
};

---

我使用

this.props.navigation.navigate（'SomeScreen'）

在屏幕之间导航，并

this.props.navigation.goBack（）

返回。

从react native导入

BackHandler

在

componentdidmount

bind

backhandler

事件中，使用

backhandler.addEventListner（）

看这个,

componentDidmount=()=>{
    BackHandler.addEventListener("hardwareBackPress", this.handleBackButton);
}

componentWillUnmount = () => {
    BackHandler.removeEventListener("hardwareBackPress", this.handleBackButton);
};

  handleBackButton = () => {
    this.props.navigation.navigate('SomeScreen');
    return true;
  };

无论您在哪里使用过

goBack（）

都可以使用

导航（“屏幕名”）

编辑：

对于其他屏幕上的意外行为， 在使用反手的情况下执行此操作

import {NavigationEvents} "react-navigation";

在第一个组件内部的渲染中

<NavigationEvents onWillFocus={this.compnentDidmount} onWillBlur={this.componentWillUnmount} />

如果您在didmount和unmount中有其他逻辑，那么为这两种逻辑分别创建方法，并在

NavigationEvents

中绑定，我找到了一个解决方案。 这是我的密码：

     export default class App extends React.Component {

      render() {
        return <AppContainer />;
      }
    };

    const stackMapPI = createStackNavigator({
        Map: {
            screen: CtrlMap,
            navigationOptions: () => ({
                header: null
            })
        },
        PI: {
            screen: MainCtrlPIQuizz,
            navigationOptions: () => ({
                header: null
            })
        }

    });

    const stackNav = createStackNavigator({
        Welcome: {
            screen: MainCtrlWelcome,
            navigationOptions: () => ({
                header: null
            })
        },
        Option: {
            screen: CtrlOptions,
            navigationOptions: () => ({
                header: null
            })
        },
        Map: {
            screen: stackMapPI,
            navigationOptions: () => ({
                header: null
            })
        }
    });

const AppContainer = createAppContainer(stackNav);

导出默认类App扩展React.Component{
render（）{
返回；
}
};
const stackMapPI=createStackNavigator({
地图：{
屏幕：CtrlMap，
导航选项：（）=>({
标题：空
})
},
PI:{
屏幕：MainCtrlPiquiz，
导航选项：（）=>({
标题：空
})
}
});
const stackNav=createStackNavigator({
欢迎:{
屏幕：MainCtrlHelpCome，
导航选项：（）=>({
标题：空
})
},
选项：{
屏幕：Ctroptions，
导航选项：（）=>({
标题：空
})
},
地图：{
屏幕：stackMapPI，
导航选项：（）=>({
标题：空
})
}
});
const AppContainer=createAppContainer（stackNav）；

谢谢！干得好，干得好。：）“return true”用于什么？它做什么？如果没有返回任何内容或返回false，正常的后退按钮功能将被触发，而不是您在方法中编码的功能。如果您有条件返回按钮行为，这将非常有用。解决方案中有一个问题。执行“this.props.navigation.navigate（'SomeScreen'）；”时，当前组件未卸载，因此，不会执行componentWillUnmount方法。如果我在不同的屏幕之间切换，会导致奇怪的行为。例如，如果我有a、b、c和d屏幕。导航应该是a->b，b->c，b->d，bd，d->b（现在可以了），但是如果我去c，当我回来时，我会回到b而不是a。因为未删除最后一个EventListener，而未添加新的。我有以下错误：不变冲突：不变冲突：元素类型无效：应为字符串（对于内置组件）或类/函数（对于复合组件），但得到：对象。检查

CtrlWelcome

的渲染方法。