簡介

??AsyncStorage是一個簡單的，具有異步特性的儲存API，它的儲存方式為鍵值對的方式，且對整個App而言，是全局的。
??AsyncStorage提供了較全的方法供我們使用，每個方法都有一個回調(diào)函數(shù)，而回調(diào)函數(shù)的第一個參數(shù)都是錯誤對象error，所有的方法執(zhí)行之后都會返回一個Promise對象。

方法

??羅列一下它的使用方法，直接從官方文檔上copy下來

static getItem(key: string, callback?: ?(error: ?Error, result: ?string) => void) 
讀取key字段并將結(jié)果作為第二個參數(shù)傳遞給callback。
如果有任何錯誤發(fā)生，則會傳遞一個Error對象作為第一個參數(shù)。返回一個Promise對象。

static setItem(key: string, value: string, callback?: ?(error: ?Error) => void) 
將key字段的值設(shè)置成value，并在完成后調(diào)用callback函數(shù)。
如果有任何錯誤發(fā)生，則會傳遞一個Error對象作為第一個參數(shù)。返回一個Promise對象。

static removeItem(key: string, callback?: ?(error: ?Error) => void) 
刪除一個字段。返回一個Promise對象。

static mergeItem(key: string, value: string, callback?: ?(error: ?Error) => void) 
假設(shè)已有的值和新的值都是字符串化的JSON，則將兩個值合并。
返回一個Promise對象。還沒有被所有原生實(shí)現(xiàn)都支持。

static clear(callback?: ?(error: ?Error) => void) 
刪除全部的AsyncStorage數(shù)據(jù)，不論來自什么庫或調(diào)用者。
通常不應(yīng)該調(diào)用這個函數(shù)——使用removeItem或者multiRemove來清除你自己的key。
返回一個Promise對象。

static getAllKeys(callback?: ?(error: ?Error, keys: ?Array<string>) => void) 
獲取所有本應(yīng)用可以訪問到的數(shù)據(jù)，不論來自什么庫或調(diào)用者。
返回一個Promise對象。

static flushGetRequests() 
清除所有進(jìn)行中的查詢操作。

static multiGet(keys: Array<string>, callback?: ?(errors: ?Array<Error>, result: ?Array<Array<string>>) => void) 
獲取keys所包含的所有字段的值，調(diào)用callback回調(diào)函數(shù)時返回一個key-value數(shù)組形式的數(shù)組。
返回一個Promise對象。
multiGet(['k1', 'k2'], cb) -> cb([['k1', 'val1'], ['k2', 'val2']])

static multiSet(keyValuePairs: Array<Array<string>>, callback?: ?(errors: ?Array<Error>) => void) 
multiSet和multiMerge都接受一個與multiGet輸出值一致的key-value數(shù)組的數(shù)組。返回一個Promise對象。
multiSet([['k1', 'val1'], ['k2', 'val2']], cb);

static multiRemove(keys: Array<string>, callback?: ?(errors: ?Array<Error>) => void) 
刪除所有鍵在keys數(shù)組中的數(shù)據(jù)。返回一個Promise對象。

static multiMerge(keyValuePairs: Array<Array<string>>, callback?: ?(errors: ?Array<Error>) => void) 
將多個輸入的值和已有的值合并，要求都是字符串化的JSON。返回一個Promise對象。
還沒有被所有原生實(shí)現(xiàn)都支持。

舉例

??只看方法可能不太好理解，直接上代碼就會清楚很多，引用代碼出處，其它一些方法的使用與此類似

import React from 'react';
import {View,StyleSheet,Text,AsyncStorage} from 'react-native';

export default class Root extends React.Component{
    constructor(props){
        super(props);
        this.set = this.set.bind(this);
        this.get = this.get.bind(this);
        this.clear = this.clear.bind(this);
    }
    //渲染布局
    render(){
        return (
            <View style = {style.container}>
                <Text onPress = {this.set}>儲存數(shù)據(jù)</Text>
                <Text style = {{marginTop: 10}} onPress = {this.get}>
                    獲取數(shù)據(jù)
                </Text>
                <Text style = {{marginTop: 10}} onPress = {this.clear}>
                    清除數(shù)據(jù)
                </Text>
            </View>
        );
    }

/**
*static setItem(key: string, value: string, callback?: ?(error: ?Error) => void) 
*將key字段的值設(shè)置成value，并在完成后調(diào)用callback函數(shù)。
*如果有任何錯誤發(fā)生，則會傳遞一個Error對象作為第一個參數(shù)。返回一個Promise對象。
*/
    set(){
        AsyncStorage.setItem('name','gefufeng',(error) => {
            if (error) {
                alert("儲存失敗");
            }else{
                alert("儲存成功");
            }
        });
    }

/**
*static getItem(key: string, callback?: ?(error: ?Error, result: ?string) => void) 
*讀取key字段并將結(jié)果作為第二個參數(shù)傳遞給callback。
*如果有任何錯誤發(fā)生，則會傳遞一個Error對象作為第一個參數(shù)。返回一個Promise對象。
*/
    get(){
        AsyncStorage.getItem('name',(error,result) => {
            if (error) {
                alert("獲取失敗");
            }else{
                alert("數(shù)據(jù)為：" + result);
            }
        });
    }

/**
*static clear(callback?: ?(error: ?Error) => void) 
*刪除全部的AsyncStorage數(shù)據(jù)，不論來自什么庫或調(diào)用者。
*通常不應(yīng)該調(diào)用這個函數(shù)——使用removeItem或者multiRemove來清除你自己的key。
*返回一個Promise對象。
*/
    clear(){
        AsyncStorage.removeItem('name',(error) => {
            if (!error) {
                alert("清除成功");
            }
        });
    }
}

const style = StyleSheet.create({
    container : {
        flex: 1,
        alignItems: 'center',
        justifyContent: 'center',
        backgroundColor : "#F5FCFF"
    }

});

補(bǔ)充

??不過為了方便起見，一般會把a(bǔ)syncstorage進(jìn)行封裝，在其他地方調(diào)用的時候?qū)⑵渥鳛橐粋€工具進(jìn)行調(diào)用，比如說下面這一塊代碼是我從某個項(xiàng)目截取的方法片段

import {AsyncStorage} from 'react-native';

export default class StorageUtil {
  /**
   * 獲取數(shù)據(jù)
   */
  static get(key, callback) {
    AsyncStorage.getItem(key, (error, object) => {
      callback(error, JSON.parse(object));
    })
  }

  /**
   * 保存
   */
  static set(key, value, callback) {
    return AsyncStorage.setItem(key, JSON.stringify(value), callback);
  }

  /**
   * 更新
   */
  static update(key, value) {
    StorageUtil.set(key, value);
  }

  /**
   * 刪除
   */
  static delete(key) {
    return AsyncStorage.removeItem(key);
  }

  /**
  * 清除所有Storage
  */
  static clear() {
    AsyncStorage.clear();
  }
}

使用時可以直接調(diào)用方法如下：

        StorageUtil.get(userInfoKey, (error, object) => {
            if (!error && object != null) {
                this.setState({userInfo: object.info});
                this.setState({loadingState: Global.loadSuccess});
          } else {
                this.setState({loadingState: Global.loadError});
          }
        })
        StorageUtil.set('username', {'username': this.loginUsername});
        StorageUtil.set('password', {'password': this.loginPassword});