非同期ストレージを使用してユーザー認証を行い、どの画面をレンダリングするかを決定しようとしています。非同期ストレージからデータを取得すると、未定義に戻って誰かが助けてくれますか?
私の取得コード:
var login;
AsyncStorage.getItem("login").then((value) => {
login = value;
}).done();
alert(login);
私のセットコード:
const insert_user = (username) => {
AsyncStorage.setItem("login", username);
Toast.show({
supportedOrientations: ['portrait', 'landscape'],
text: `User registered with success`,
position: 'bottom',
buttonText: 'Dismiss'
});
}
AsyncStorage.getItemは本質的に非同期であるため、AsyncStorage.getItemから値を受け取る前に最初にalert(login)が呼び出されるため、alert(login);
は常に未定義になります。
AsyncStorage.getItem("login").then((value) => {
alert(value); // you will need use the alert in here because this is the point in the execution which you receive the value from getItem.
// you could do your authentication and routing logic here but I suggest that you place them in another function and just pass the function as seen in the example below.
});
// a function that receives value
const receiveLoginDetails = (value) => {
alert(value);
}
// pass the function that receives the login details;
AsyncStorage.getItem("login").then(receiveLoginDetails);
さらに参照
{AsyncStorage}を 'react-native'からインポートします。
AsyncStorage.setItem('mobileNumber', phoneNumber.number);
AsyncStorage.getItem('mobileNumber', (error, result) => {
this.setState({
loginMobileNo: result,
});
"react-native"を使用する場合: "0.56.0":-
「Pref.js」という名前のファイルを作成以下の内容で。 (Pref.jsは、任意の.jsファイルで使用できるように、AsyncStorageを使用してデータを設定および取得するためのグローバルファイルのようなものです)。
//---- Pref.js ---->
import { AsyncStorage, Alert } from "react-native"
export const kUserName = 'user_name';
export const kUserID = 'user_id';
export const setData = async (strKey, item) => {
let value = JSON.stringify(item)
if (value) {
AsyncStorage.setItem(strKey, value);
}
}
export const getData = (strKey, callback = (response1) => { }) => {
AsyncStorage.getItem(strKey).then((value) => {
callback(value)
});
}
--------- "index.js"ファイルで上記のファイルを使用する---------> (正しいパスでPref.jsファイルをインポートする)
import * as Pref from '../../Pref/Pref' //IMPORTANT: set your file path.
onLoginClick = () => {
// Set data in AsyncStorage using "Pref.js" file. "Pref.kUserName" is from Pref.js file:
Pref.setData(Pref.kUserName, 'Hello World')
// Get data from AsyncStorage using "Pref.js" file.
Pref.getData(Pref.kUserName, (value) => {
if (value) {
Alert.alert(`Welcome ${value}`)
//this.props.navigation.Push('Home')
}
});
}
私の最後では、アイテムの設定時にStrigyFyを使用したときにAsyncStorage.getItem( 'foo')が機能します。
var myStr = JSON.stringify(yourData);
キーで設定するには
AsyncStorage.setItem('key', myStr);
アイテムを入手するには
var value = AsyncStorage.getItem('key');
AsyncStorageをasyncおよびawaitと一緒に使用するのは次のとおりです。
import { getItem as localStorageGetItem, setItem as localStorageSetItem } from 'services/localStorage';
async loginHandler (){
localStorageSetItem(ACCESS_TOKEN, response.accessToken);
var token = await localStorageGetItem(ACCESS_TOKEN);
}
localStorage.jsファイル
import AsyncStorage from '@react-native-community/async-storage';
export const getItem = async(item) => {
try {
const value = await AsyncStorage.getItem(item);
return JSON.parse(value);
} catch (error) {
return null;
}
};
export const setItem = async(item,value)=>{
try {
await AsyncStorage.setItem(item, JSON.stringify(value));
} catch (error) {
console.log("SetItem error ",error)
return null;
}
}