在应用重新加载时重新加载AsyncStorage的数据可以通过以下步骤实现:
App.js
的文件,并在其中添加以下代码:import React, { useEffect, useState } from 'react';
import { AsyncStorage, View, Text } from 'react-native';
const App = () => {
const [data, setData] = useState('');
useEffect(() => {
// 在组件挂载时加载AsyncStorage数据
loadDataFromAsyncStorage();
}, []);
const loadDataFromAsyncStorage = async () => {
try {
const value = await AsyncStorage.getItem('data');
setData(value || '');
} catch (error) {
console.log(error);
}
};
const saveDataToAsyncStorage = async () => {
try {
await AsyncStorage.setItem('data', 'Hello, AsyncStorage!');
} catch (error) {
console.log(error);
}
};
return (
{data}
);
};
export default App;
package.json
的文件,并添加以下内容:{
"name": "AsyncStorageReloadExample",
"version": "1.0.0",
"scripts": {
"start": "react-native start",
"android": "react-native run-android",
"ios": "react-native run-ios"
},
"dependencies": {
"react": "16.13.1",
"react-native": "0.63.2",
"@react-native-community/async-storage": "^1.12.1"
}
}
npm install
npm run android
npm run ios
现在,当您重新加载应用程序时,AsyncStorage中的数据将重新加载并显示在屏幕上。您还可以通过点击"Save to AsyncStorage"按钮将数据保存到AsyncStorage中。