react-navigation goBack返回指定页面

重新看了下文档


屏幕快照 2018-09-12 下午2.33.39.png

所以只需要this.props.navigation.navigate('xxx')这样就可以了,下边方法没用了

1.问题
react-navigation设置导航后,调用this.props.navigation.goBack('xxx')返回指定页面无效

2.解决

const AppNavigator = StackNavigator({
    Home: {screen: Home},
    ShopDetail: {screen: ShopDetail}
});

const defaultGetStateForAction = AppNavigator.router.getStateForAction;
AppNavigator.router.getStateForAction = (action, state) => {
    // goBack返回指定页面
    if (state && action.type === 'Navigation/BACK' && action.key) {
        const backRoute = state.routes.find((route) => route.routeName === action.key);
        if (backRoute) {
            const backRouteIndex = state.routes.indexOf(backRoute);
            const purposeState = {
                ...state,
                routes: state.routes.slice(0, backRouteIndex + 1),
                index: backRouteIndex,
            };
            return purposeState;
        }
    }
    return defaultGetStateForAction(action, state)
};

3.分析
拦截路由的getStateForAction(action, state)

屏幕快照 2017-12-22 上午9.45.45.png

调用this.props.navigation.goBack('Home')时的action、state如图,根据action中的key和type重新配置路由后重新返回一个新的state

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。