离线录入数据自动调用api更新数据到数据库

Question

我想在没有联网的情况下离线存储数据，联网后通过api自动更新数据到数据库。我如何使用本机反应、netinfo 和 redux-saga 或任何其他解决方案来做到这一点？非常感谢

Answer 1

从检测连接，你可以使用这个库

@react-native-community/netinfo

您需要创建全局组件来显示互联网连接（可能是 ModalNetworkError）。在该组件内部，您应该在使用效果中处理互联网连接，就像这样。当没有互联网连接时，您将更新您的减速器。当用户有互联网连接时，调用 api。也许你还需要存储最后一个 api 调用。

useEffect(() => {
    const unsubscribe = NetInfo.addEventListener((state) => {
      if (state.type === 'unknown') {
        setShowModal(false)
      } else if (state.isConnected && state.isInternetReachable) {
        setShowModal(false)
        // call api here
      } else if (state.type !== '' && state.isConnected && !state.isInternetReachable) {
        setShowModal(false)
        // update your reducer here
      } else {
        setShowModal(true)
      }
    })

    return () => {
      unsubscribe()
    }
 }, [showModal, dispatch])

因为我用的是react hooks，所以我把这个全局组件放到了我的routes js里面。像这样，

<NavigationContainer linking={linking}>
  <RootStackScreen guest={guest} welcome={welcome} userToken={userToken} />
  <ModalNetworkError />
</NavigationContainer>

离线录入数据自动调用api更新数据到数据库

Enter data offline and automatically call api to update data to database

react-native

redux-saga