基于 API 调用的导航 redux 和 react native答案

【问题标题】：Navigation redux and react native based on API call基于 API 调用的导航 redux 和 react native
【发布时间】：2018-01-18 11:15:45
【问题描述】：

我在我的移动应用程序中使用 redux 和 react native。

我想根据 API 响应重定向到另一个屏幕。我不知道该怎么做。

我在我的应用程序中使用了 action、reducer 和 store。

你能帮我找到标准解决方案吗？

提前谢谢你。

【问题讨论】：

你用的是哪个导航库？
一种方法是使用反应生命周期组件WillReceiveProps，例如，根据 nextProps 使用this.props.history 重定向用户。这是一个例子github.com/strapi/strapi/tree/master/packages/…
@AjithPandian 我正在使用 react-navigation 库。
@soupette 我不确定如何根据中间件 API 调用响应更改屏幕。
@NikhilParmar 您能否提供一个小示例，说明您需要根据您的回复进行什么样的导航？

标签： react-native navigation react-redux

【解决方案1】：

处理用户导航的一种方法，例如注册用户是首先定义三个动作：register、registerSuccess、registerError。

负责处理导航的是 registerSuccess，它只会返回一个类型“REGISTER_SUCCESS”。

那么你的 reducer 会是这个样子（我用的是 immutable.js https://facebook.github.io/immutable-js/docs/#/）

 const initialState = fromJS({
   submitSuccess: false,
 });

function reducer(state = initialState, action) {
  case REGISTER_SUCCESS:
     return state.update('submitSuccess', (v) => !v));
   default:
     return state;

然后在你的容器中你可以使用componentWillReceiveProps来重定向你的用户

 componentWillReceiveProps(nextProps) {
   if (nextProps.submitSuccess) {
     // redirect your user 
   }
 }

【讨论】：

这是一个工作示例github.com/strapi/strapi-examples/tree/master/login-react

【解决方案2】：

查看文档如何将导航连接到 Redux -> https://reactnavigation.org/docs/guides/redux

【讨论】：

我收到了这篇文章，只是不知道如何根据我在中间件中使用的 API 的响应重定向到屏幕。
您需要导航将处理的调度操作 ``` import { addNavigationHelpers, NavigationActions } from "react-navigation";调度（NavigationActions.back（））； ```