Question

我正在编写一个本机应用程序，该应用程序需要在关闭或后台运行字符串之前存储它。应用启动时，它需要再次检索字符串。（我正在使用expo进行开发）

我试图将数据存储在componentWillUnmount()中，但是当我关闭应用程序时未调用该函数。

这是存储数据的功能。

_storeData = async () => {
try {
  await AsyncStorage.setItem('data', 'savedData2');
  console.log("done storing");
} catch (error) {
  console.log(error)
}};

我正在按以下方式致电storeData()：

componentWillUnmount() {
 console.log("unmount")
 this._storeData();
}

首先，我认为它不存储数据，因为我在componentWillUnmount()中调用了一个异步函数，该函数可能在完成之前被取消，但是我也没有收到unmount日志。

Answer 1

无法检测到何时以本机模式关闭该应用。

您可以使用AppState检测应用何时在后台运行，请尝试在文档中进行检查：https://facebook.github.io/react-native/docs/appstate

Answer 2

我正在使用here发现的文档中经过稍作修改的代码，效果很好。

在要在后台运行时要在其中保存数据的组件上，可以添加以下内容：

componentDidMount() {
    AppState.addEventListener('change', this._handleAppStateChange);
    this._recoverData();
}

componentWillUnmount() {
    AppState.removeEventListener('change', this._handleAppStateChange);
}

_handleAppStateChange = (nextAppState) => {
    if (nextAppState === 'background' || nextAppState === 'inactive') {
        this._storeData('dataToSave');
    }
};

使用AppState，您将能够控制应用何时进入后台以及何时再次变为“活动”状态。

我在这些代码段中调用的_recoverData和_storeData是使用AsyncStorage的异步函数，因此您的方法应该没问题。

此外，您可以在文档上找到此注释：

此示例只会出现“当前状态：处于活动状态”的信息，因为该应用程序仅在处于活动状态时才对用户可见，而空状态只会暂时发生。

这可能是您没有收到卸载日志的原因（尽管我没有尝试过）。

Answer 3

有一种方法可以使用React Navigation。选中this。

Answer 4

我有一些适合我的代码。基本上它检查应用程序状态是主动还是被动。即使您使用后退按钮关闭应用程序也会被动触发。在我的示例中，我正在跟踪用户在我的应用中处于活动状态或非活动状态的天气。

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
        package="androidx.vectordrawable-animated:1.0.0">

React-Native：如何在应用关闭之前保存数据

4 个答案: