реагировать на навигацию, как вернуться в другой стек

Question

const HomeStack = createStackNavigator({
    Home: HomeScreen,
});

const CarStack = createStackNavigator({
    Booking: BookingScreen,
    Confirm: ConfirmScreen

});

export default createBottomTabNavigator({
    HomeStack,
    CarStack,
});

export default class HomeScreen extends React.Component {
    goTo(){
            this.props.navigation.navigate('Confirm')
    }
    render() {
        return (
            <View style={css.container}>
                <button onPress={this.goTo.bind(this)}>go to</button>
            </View>
        );
    }   
}



export default class ConfirmScreen extends React.Component {
    goBack(){
            this.props.navigation.goBack()
    }
    render() {
        return (
            <View style={css.container}>
                <button onPress={this.goBack.bind(this)}>goback</button>
            </View>
        );
    }   
}

На главном экране, когда я нажимаю кнопку goto, я перехожу на экран подтверждения, и это хорошо.Но когда я нажимаю «вернуться», вместо главного экрана меня выводит экран бронирования.Что плохоПредположим, вывести меня на домашний экран.Что мне здесь не хватает?

Answer 1

Если вы используете react-navigation v2.x или выше, напрямую используйте метод navigate, чтобы перейти к экрану Home.

Настройте поведение кнопки «Назад» и вызовите this.props.navigation.navigate('Home'), нажав кнопку «Назад» на экране Confirmation.Это приведет к желаемому эффекту.

Поскольку react-navigation v2.0, действие navigate менее настойчиво.Если указанный вами маршрут уже находится в стеке, то этот экран будет открыт, вместо того, чтобы по умолчанию вставлять новый экран в стек.

Ссылка

Answer 2

Попробуйте это:

this.props.navigtion.goBack('Home')

Надеюсь, это поможет вам.

Answer 3

Вы должны определить 2 отдельных навигатора и проверить пользователя / гостя в другом компоненте.как это:

Provider.js:

export default class Provider extends Component {
    render() {
        let {key, signedIn, checkedSignIn} = this.state
        return(
            <View>
                {
                    checkedSignIn
                        ? signedIn
                            ? <App />
                            : <SignedOut />
                        : null
                }
            </View>
        )
    }
}

App.js:

export default createStackNavigator({
    home: Home // sample
})

SignedOut.js:

export default createStackNavigator({
    auth: Auth // sample
})