本文出自《React Native 每日一學(xué)(Learn a little every day)》欄目鸠姨。
AsyncStorage存儲(chǔ)key管理小技巧
場(chǎng)景
AsyncStorage是React Native推薦的數(shù)據(jù)存儲(chǔ)方式。當(dāng)我們需要根據(jù)條件從本地查詢出多條記錄時(shí)湾蔓,你會(huì)想到來(lái)一個(gè)select * from xx where xx
。但是很不幸的告訴你埃难,AsyncStorage
是不支持sql的银还,因?yàn)锳syncStorage是Key-Value存儲(chǔ)系統(tǒng)努隙。
那么如何才能快速的從眾多記錄中將符合條件的記錄查詢出來(lái)呢樱哼?
請(qǐng)往下看...
AsyncStorage key管理
為了方便查詢多條符合規(guī)則的記錄哀九,我們可以在保存數(shù)據(jù)前,對(duì)這條數(shù)據(jù)進(jìn)行分類搅幅,然后記錄下這條記錄的key阅束。下次再查詢?cè)摂?shù)據(jù)前,只需要先查詢之前保存的key茄唐,然后通過
static multiGet(keys, callback?)
API息裸,將符合規(guī)則的數(shù)據(jù)一并查詢出來(lái)。
用例
保存數(shù)據(jù)
第一步:保存數(shù)據(jù)
saveFavoriteItem(key,vaule,callback) {
AsyncStorage.setItem(key,vaule,(error,result)=>{
if (!error) {//更新Favorite的key
this.updateFavoriteKeys(key,true);
}
});
}
第二步:更新key
/**
* 更新Favorite key集合
* @param isAdd true 添加,false 刪除
* **/
updateFavoriteKeys(key,isAdd){
AsyncStorage.getItem(this.favoriteKey,(error,result)=>{
if (!error) {
var favoriteKeys=[];
if (result) {
favoriteKeys=JSON.parse(result);
}
var index=favoriteKeys.indexOf(key);
if(isAdd){
if (index===-1)favoriteKeys.push(key);
}else {
if (index!==-1)favoriteKeys.splice(index, 1);
}
AsyncStorage.setItem(this.favoriteKey,JSON.stringify(favoriteKeys));
}
});
}
查詢批量數(shù)據(jù)
第一步:查詢key
getFavoriteKeys(){//獲取收藏的Respository對(duì)應(yīng)的key
return new Promise((resolve,reject)=>{
AsyncStorage.getItem(this.favoriteKey,(error,result)=>{
if (!error) {
try {
resolve(JSON.parse(result));
} catch (e) {
reject(error);
}
}else {
reject(error);
}
});
});
}
第二步:根據(jù)key查詢數(shù)據(jù)
AsyncStorage.multiGet(keys, (err, stores) => {
try {
stores.map((result, i, store) => {
// get at each store's key/value so you can work with it
let key = store[i][0];
let value = store[i][1];
if (value)items.push(JSON.parse(value));
});
resolve(items);
} catch (e) {
reject(e);
}
});
以上是我在使用AsyncStorage進(jìn)行批量數(shù)據(jù)查詢的一些思路琢融,大家根據(jù)實(shí)際情況進(jìn)行調(diào)整界牡。
About
本文出自《React Native 每日一學(xué)(Learn a little every day)》欄目簿寂。
了解更多漾抬,可以關(guān)注我的:
推薦閱讀
- React Native 學(xué)習(xí)筆記
- React Native Awesome(匯聚知識(shí),分享精華):匯集了各類react-native學(xué)習(xí)資料常遂、工具纳令、組件、開源App克胳、資源下載平绩、以及相關(guān)新聞等。