react-native - 离线第一个具有后台同步功能的 React Native Expo 应用程序

Question

我正在考虑构建一个离线的第一个 React Native Expo 应用程序，该应用程序会在设备获得连接时自动将数据推送到 API。但是，我正在努力了解这在世博会内是否可行，并且需要一些指导。

该应用程序需要存储来自 API 的数据以供离线使用(大概是在第一次加载时，然后将用于填充表单中的字段)。该表单需要离线工作，输入数据存储在设备上，直到它收到新的连接。此时，应用程序应将数据推送到 API(同时应用程序在后台运行)。所以我需要做很多事情:

1. 在首次启动时自动从 API 下载和存储数据。
2. 存储输入数据 - 来自离线时的表单字段。
3. 后台同步 - 在收到新连接时上传此用户表单数据，无论应用是否在后台运行。
4. 在 Android 和 iOS 设备上工作。

我一直在看redux-offline ，但不确定它是否仍然支持和/或将满足所有四个要求？还有redux-persist但我看不出这如何满足后台同步？

感谢您的帮助/指导!

Answer 1

在我看来，与 redux-offline 相比，redux-persist 没有那么固执己见。我用 useNetInfo 选择 redux-persist Hook 以监听网络可用性。

<强>1。首次启动时自动从 API 下载和存储数据。

当应用启动时，查询初始数据并发送到 redux 存储，并通过 redux-persist 自动同步到本地存储

<强>2。存储输入数据 - 来自离线时的表单字段。

使用 useNetInfo，应用程序可以检测网络连接状态，当未连接时，使用标志分派(dispatch)到 redux 存储以指示离线未同步数据。

您需要编写一个网络连接监听器，它在网络状态发生变化时执行，并持续跟踪未同步的数据并在可用时与数据库同步，并清除表单值等临时数据。

<强>3。后台应用同步

Expo SDK 提供 API https://docs.expo.dev/versions/latest/sdk/background-fetch/在特定时间阈值连续运行后台任务。

您可以在应用程序后台恢复网络时同步离线数据。

免责声明:后台任务在 React 组件树之外运行。您无法通过 react-redux 的商店 组件或基于 Hook 的 API 访问 redux 商店数据。

redux-persist 使用 Async Storage 保存数据，您需要直接访问数据，如下所示。

AsyncStorage.getItem("persist:[REDUCER_CONTAIN_INTERESTED_DATA]")