Есть ли способ сохранить и восстановить историю навигации в реагирующей навигации (реактивной)

У меня есть StackNavigator(1) с 5 экранами. После 3-го экрана я перехожу на другой экран StackNavigator(2), и после некоторых действий на втором экране StackNavigator(2) мне нужно вернуться к 4-му экрану Stack StackNavigator(1), и я должен иметь возможность вернуться к истории в StackNavigator( 1) используя navigation.goBack()

Я могу вернуться на 4-й экран Stack StackNavigator(1), но когда я использую navigation.goBack(), он не переходит на 3-й экран StackNavigator(1)

Мне нужно сохранить и восстановить историю навигации в StackNavigator(1).

Пожалуйста, дайте мне знать, есть ли способ достичь этого.

введите здесь описание изображения


person Anish    schedule 16.08.2017    source источник
comment
Эй, Аниш, у меня есть аналогичный вариант использования для реализации. Вы смогли решить эту проблему?   -  person ruyamonis346    schedule 29.10.2018
comment
Как вы решили эту проблему?   -  person Toto NaBendo    schedule 15.01.2020


Ответы (1)


Используйте StackNavigator.router.getStateForAction для управления состоянием вашего маршрута.

    //assume your StackNavigator1 just like below
    const StackNavigator1 = new StackNavigator({
        Screen1: {screen: Screen1},
        Screen2: {screen: Screen2},
        Screen3: {screen: Screen3},
        Screen4: {screen: Screen4},
        Screen5: {screen: Screen5}
    });

    const defaultGetStateForAction = StackNavigator1.router.getStateForAction;
    //store the state when navigate to screen3
    let state3;

    StackNavigator1.router.getStateForAction = (action, state) => {

        let newState = defaultGetStateForAction(action, state);
        //print out the state object
        console.log(`newState: ${newState}`);

        //change all the routeName 'Screen3', 'Screen4' to match your own project
        if (action.type === 'Navigation/NAVIGATE' && action.routeName === 'Screen3') {
            //store the state of screen3 for restore it later
            state3 = newState;
        }

        if (action.type === 'Navigation/NAVIGATE' && action.routeName === 'Screen4') {
            //check if screen3 exist in the state, change the condition for your own need
            let result = newState.routes.find((route) => {
                return route.routeName === 'Screen3'
            });
            //if 'screen3' doesn't exist, add it to the route manually
            if (result === undefined && state3 !== undefined) {
                let route4 = newState.routes[newState.index];
                let routes = state3.routes.slice();
                routes.push(route4);
                return {index: 3, routes}
            }
        }

        return defaultGetStateForAction(action, state)
    };

//... the rest code
person ufxmeng    schedule 18.08.2017