React-Native中的數(shù)據(jù)持久化方式

react-native.jpeg

因為之前是做iOS開發(fā)的,沒使用過安卓的存儲方式,所以本文章只寫利用JS來實現(xiàn)的方法。
文章中如果有不清楚或者不對的地方,歡迎再評論區(qū)留言或者私信給我或者加QQ群397885169討論。

1.AsyncStorage

AsyncStorage是react-native官方提供的數(shù)據(jù)存儲方式,采用鍵值對存儲的方式,通過key=>value對應(yīng)來存取數(shù)據(jù),需要注意的是AsyncStorage中只能存儲字符串,如果想要存儲對象(objec)數(shù)組(array)或者其他類型,需要轉(zhuǎn)換成字符串才可以。

數(shù)據(jù)存儲
// 單數(shù)據(jù)存儲
// 鍵
let key = 'myKey';
// 值(正確的,字符串)
let valueString = 'myValue';
// 數(shù)據(jù)存儲
// key  : string, (字符串型的鍵)
// value: string, (字符串型的值)
// error: Error,  (錯誤信息)
AsyncStorage.setItem(key,valueString,(error)=>{
    if (error){
        console.log('存儲失敗' + error);
    }else {
        console.log('存儲成功');
    }
})

// 值(錯誤的,對象)
let valueObject = {'one':'1','two':'2'};
// 值(錯誤的,數(shù)組)
let valueArray = ['one','two'];
// 如果需要存儲對象類型或者數(shù)組類型的值,需要將其轉(zhuǎn)換成字符型,然后再進行鍵值存儲。
// 轉(zhuǎn)換對象
valueObject = JSON.stringify(valueObject);  
// 轉(zhuǎn)換數(shù)組
valueArray = JSON.stringify(valueArray);  

// 多數(shù)據(jù)存儲
// 鍵
let key = 'myKey';
let multKey = [['one','1'],['two','2']];
let multValue = ['1','2'];
AsyncStorage.multiSet(multKey,(error)=>{
    if (error){
        console.log('存儲失敗' + error);
    }else {
        console.log('存儲成功');
    }
})
數(shù)據(jù)獲取
// 單數(shù)據(jù)獲取
// 鍵
let key = 'myKey';
// 數(shù)據(jù)讀取
// key   : string, (字符串型的鍵)
// Error : Error,  (Error信息,判斷這個參數(shù)并不能確定是否錯誤)
// result: string, (正確的返回信息,通過判斷它,才能知道返回信息是否正確)
AsyncStorage.getItem(key,(Error,result)=>{
    if (result === null){
        console.log('獲取失敗' + result);
    }else {
        console.log('獲取成功' + result);
        // 這里返回的才是正確參數(shù)。
        // 如果返回的是轉(zhuǎn)換過的對象類型或者數(shù)組類型,需要再次轉(zhuǎn)換。
        console.log(JSON.parse(result));
    }
})

// 多數(shù)據(jù)獲取
// key需要和存儲的key對應(yīng)。
let multKey = ['one','two'];
AsyncStorage.multiGet(multKey,(Error,result)=>{
    if (result===null){
        console.log('獲取失敗' + result);
    }else {
        console.log('獲取成功' + result);
    }
})

// 全部獲取
AsyncStorage.getAllKeys((error,result)=>{
    if (result===null){
        console.log('獲取失敗' + result);
    }else {
        console.log('獲取成功' + result);
    }
});
數(shù)據(jù)刪除
// 刪除單個數(shù)據(jù)可以通過removeItem
// 要刪除的key
let key = 'myKey';
AsyncStorage.removeItem(key);

// 刪除多個數(shù)據(jù)可以使用multiRemove
// 要刪除的key數(shù)組
let keyArr = ['one','two'];
AsyncStorage.multiRemove(keyArr);

// 刪除所有數(shù)據(jù)
AsyncStorage.clear();

2.react-native-storage

這個是react-native中文網(wǎng)封裝,可以同時支持react-native(AsyncStorage)和瀏覽器(localStorage)的數(shù)據(jù)存于方式,使用ES6語法。
官方提供的文檔很清晰,可以跳轉(zhuǎn)到github(react-native-storage)上查看,如果使用中遇到問題,可以在下方評論或者私信給我

3.react-native-sqlite

如果在之前的開發(fā)中使用過其他語言的數(shù)據(jù)庫,就會知道sqlite雖然是一個很強大,很輕量的數(shù)據(jù)庫,但對于其嚴格的語法,復(fù)雜的語句,所以我很推薦最后一個數(shù)據(jù)庫來替代react-native-sqlite

sqlite.open("filename.sqlite", function (error, database) {
    if (error) {
        console.log("Failed to open database:", error);
        return;
    }
    var sql = "SELECT a, b FROM table WHERE field=? AND otherfield=?";
    var params = ["somestring", 99];
    database.executeSQL(sql, params, rowCallback, completeCallback);
    function rowCallback(rowData) {
        console.log("Got row data:", rowData);
    }
    function completeCallback(error) {
        if (error) {
        console.log("Failed to execute query:", error);
        return
        }
        console.log("Query complete!");
        database.close(function (error) {
            if (error) {
                console.log("Failed to close database:", error);
            return
            }
        });
    }
});

4.Realm

realm是一個跨平臺移動數(shù)據(jù)庫引擎,支持iOS、OS X(Objective-C和Swift)、Android以及react-native。
在使用過程中,簡單,粗暴,而且官方文檔清晰,全面。

總結(jié)

2017年第一篇文章,寫的有點水,但也是很努力的研究過這幾個方法,過段時間會把寫好的demo放到github上。
2017年,我會努力寫更多的,更好的文章來分享給大家,歡迎各位在評論區(qū)評論和發(fā)私信給我呦!

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

推薦閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 173,333評論 25 708
  • React Native優(yōu)秀博客,以及優(yōu)秀的Github庫列表(很多英文資料源自于[awesome-react-n...
    董董董董董董董董董大笨蛋閱讀 10,735評論 4 162
  • 夫稱君子者,心無措乎是非,而行不違乎道者也。何以言之?夫氣靜神虛者,心不存于矜尚;體亮心達者,情不系于所欲。矜尚不...
    羽琉璃001閱讀 2,739評論 0 1
  • 撐開天堂牌子的傘 隨雨而降的福音 滴滴均是梵 恩澤世間 并超度罪 欲 孽 度一顆心 如粒水珠明凈 撐開傘聽雨...
    一慧一閱讀 379評論 0 1
  • 塞上江南春意晚, 青桃猶小粉合歡。 春風幾度化法雨, 鐘磬不鳴燕呢喃。
    江南煙雨閱讀 355評論 2 4