Question

我正在使用firebase构建一个具有react native的应用程序。我正在努力应该如何在我的app中构建我的redux动作。

按现状，我有一个将获取用户个人资料的功能。我引用了firebase firestore，然后使用then和catch语句来解析返回的promise。这就是我的问题所在。

return(dispatch){
dispatch({type: GET_PROFILE})
var docRef = firebase.firestore().doc('users/' + userUid);
docRef.get()
.then(() => {
    dispatch({type: GET_PROFILE_SUCCESS})
})
.catch(() => {
   dispatch({type: GET_PROFILE_FAIL})
})
}

我正在调度动作GET_PROFILE，以便在我的配置文件屏幕中调用我的渲染函数时，它将在用户等待时加载微调器。我遇到的问题是，如果用户没有连接到互联网。当他们发出请求时，操作被发送到redux但是从未调度GET PROFILE SUCCESS / FAIL，因为没有互联网连接不是错误

因此，所有用户看到的都是微调器，直到他们重新启动应用程序。我基本上想提醒用户他们需要连接到互联网。我是新来的原生反应，有人可能会告诉我在本地做反应的最佳方法是什么？

由于

Answer 1

您可以将此段代码用于网络故障情况

{username, email, plainPassword : {first, second} }

Answer 2

您可以使用NetInfo获取网络信息并将其存储在redux：

中

在您的主要组件中：

componentDidMount() {
    NetInfo.isConnected.fetch().then((isConnected) => {
      store.dispatch({ type: 'CHANGE_CONNECTION_STATUS', isConnected });
    });
    NetInfo.isConnected.addEventListener('connectionChange', this.handleConnectionChange);
}

componentWillUnmount() {
    NetInfo.isConnected.removeEventListener('connectionChange', this.handleConnectionChange);

handleConnectionChange = (isConnected: boolean) => {
    store.dispatch({ type: 'CHANGE_CONNECTION_STATUS', isConnected }));
}

然后，您可以使用if语句包装您的请求以处理脱机用例：

return(dispatch){
  if(store.getState().isConnected) {
    dispatch({type: GET_PROFILE})
    var docRef = firebase.firestore().doc('users/' + userUid);
    docRef.get()
    .then(() => {
        dispatch({type: GET_PROFILE_SUCCESS})
    })
    .catch(() => {
       dispatch({type: GET_PROFILE_FAIL})
    })
  } else {
    Alert.alert('You are offline');
  }
}

处理react native / redux中的异步请求

2 个答案: