react-native之AsyncStorage 原 薦

AsyncStorage是一個簡單的，具有異步特性的儲存API，它的儲存方式爲鍵值對的方式，且對整個App而言，是全局的。

AsyncStorage提供了較全的方法供我們使用，每個方法都有一個回調函數，而回調函數的第一個參數都是錯誤對象error，所有的方法執行之後都會返回一個Promise對象。

方法：

static getItem(key: string, callback?: ?(error: ?Error, result: ?string) => void) 

讀取key字段並將結果作爲第二個參數傳遞給callback。如果有任何錯誤發生，則會傳遞一個Error對象作爲第一個參數。返回一個Promise對象。

static setItem(key: string, value: string, callback?: ?(error: ?Error) => void) 

將key字段的值設置成value，並在完成後調用callback函數。如果有任何錯誤發生，則會傳遞一個Error對象作爲第一個參數。返回一個Promise對象。

static removeItem(key: string, callback?: ?(error: ?Error) => void) 

刪除一個字段。返回一個Promise對象。

static mergeItem(key: string, value: string, callback?: ?(error: ?Error) => void) 

假設已有的值和新的值都是字符串化的JSON，則將兩個值合併。返回一個Promise對象。還沒有被所有原生實現都支持。

static clear(callback?: ?(error: ?Error) => void) 

刪除全部的AsyncStorage數據，不論來自什麼庫或調用者。通常不應該調用這個函數——使用removeItem或者multiRemove來清除你自己的key。返回一個Promise對象。

static getAllKeys(callback?: ?(error: ?Error, keys: ?Array<string>) => void) 

獲取所有本應用可以訪問到的數據，不論來自什麼庫或調用者。返回一個Promise對象。

static flushGetRequests() 

清除所有進行中的查詢操作。

static multiGet(keys: Array<string>, callback?: ?(errors: ?Array<Error>, result: ?Array<Array<string>>) => void) 

獲取keys所包含的所有字段的值，調用callback回調函數時返回一個key-value數組形式的數組。返回一個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數組的數組。返回一個Promise對象。

multiSet([['k1', 'val1'], ['k2', 'val2']], cb);

static multiRemove(keys: Array<string>, callback?: ?(errors: ?Array<Error>) => void) 

刪除所有鍵在keys數組中的數據。返回一個Promise對象。

static multiMerge(keyValuePairs: Array<Array<string>>, callback?: ?(errors: ?Array<Error>) => void) 

將多個輸入的值和已有的值合併，要求都是字符串化的JSON。返回一個Promise對象。

還沒有被所有原生實現都支持。

小例子：

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}>儲存數據</Text>
				<Text style = {{marginTop: 10}} onPress = {this.get}>
					獲取數據
				</Text>
				<Text style = {{marginTop: 10}} onPress = {this.clear}>
					清除數據
				</Text>
			</View>
		);
	}
	set(){
		AsyncStorage.setItem('name','gefufeng',(error) => {
			if (error) {
				alert("儲存失敗");
			}else{
				alert("儲存成功");
			}
		});
	}
	get(){
		AsyncStorage.getItem('name',(error,result) => {
			if (error) {
				alert("獲取失敗");
			}else{
				alert("數據爲：" + result);
			}
		});
	}
	clear(){
		AsyncStorage.removeItem('name',(error) => {
			if (!error) {
				alert("清除成功");
			}
		});
	}
}
const style = StyleSheet.create({
	container : {
		flex: 1,
		alignItems: 'center',
		justifyContent: 'center',
		backgroundColor : "#F5FCFF"
	}

});