AsyncStorage 是react-native 用来做异步存储使用的 ，它的所有的api都有一个回调方法，回调方法的第一个参数是error，显示错误信息，如果没有错误则为 null ，AsyncStorage 返回的都是一个Promise 对象 ，一下是一些比较常用到的API
-
- static getItem(key:string , callback:(error,result)): 根据键来获取值，获取的结果会在回调函数中。
- static setItem(key:string , value:string , callback:(error)): 设置键值对。
- static removeItem(key:string , callback:(error)): 将根据键移出一项
- static mergeItem:(key:string , value:string , callback:(error)): 合并现有的值和输入值。
- static clear(callback:(error)): 清除所有的项目。
- static getAllKeys(callback:(error)): 获取所有的键。
- static multiGet(keys,callback:(errors,result)):获取多项，其中keys是字符串数组。
- static multiSet(keyValuePairs,callback:(errors)):设置多项，其中keyValuePairs是字符串的二维数组。
- static multiRemove(keys,callback(errors)):删除多项，其中keys是字符串数组。
- static multiMerge(keyValuePairs,callback:(errors)):多个键值合并，其中keyValuePairs是字符串中的二维数组。
'use strict'
;
import React, {
AppRegistry,
Component,
StyleSheet,
Text,
View,
AsyncStorage,
TouchableHighlight,
} from
'react-native'
;
var
STORAGE_KEY_ONE =
'@AsyncStorageDemo:key_one'
;
var
STORAGE_KEY_MESSAGE =
'@AsyncStorageDemo:key_message'
;
//简单封装一个组件
class CustomButton extends React.Component {
render() {
return
(
<TouchableHighlight
style={styles.button}
underlayColor=
"#a5a5a5"
onPress={
this
.props.onPress}>
<Text style={styles.buttonText}>{
this
.props.text}</Text>
</TouchableHighlight>
);
}
}
class AsyncStorageDemo extends Component {
constructor(props){
super
(props);
this
.state={
messages:[],
};
}
//组件挂载之后回调方法
componentDidMount(){
this
._loadInitialState().done();
}
//初始化数据-默认从AsyncStorage中获取数据
async _loadInitialState(){
try
{
var
value=await AsyncStorage.getItem(STORAGE_KEY_ONE);
if
(value!=
null
){
this
._appendMessage(
'从存储中获取到数据为:'
+value);
}
else
{
this
._appendMessage(
'存储中无数据,初始化为空数据'
);
}
}
catch
(error){
this
._appendMessage(
'AsyncStorage错误'
+error.message);
}
}
//进行储存数据_ONE
async _saveValue_One(){
try
{
await AsyncStorage.setItem(STORAGE_KEY_ONE,
'我是老王'
);
this
._appendMessage(
'保存到存储的数据为:'
+
'我是老王'
);
}
catch
(error){
this
._appendMessage(
'AsyncStorage错误'
+error.message);
}
}
//进行存储数据删除_ONE
async _removeValue_One(){
try
{
await AsyncStorage.removeItem(STORAGE_KEY_ONE);
this
._appendMessage(
'数据删除成功...'
);
}
catch
(error){
this
._appendMessage(
'AsyncStorage错误'
+error.message);
}
}
//进行把message信息添加到messages数组中
_appendMessage(message){
this
.setState({messages:
this
.state.messages.concat(message)});
}
render() {
return
(
<View>
<Text style={styles.welcome}>
AsyncStorage使用实例
</Text>
<CustomButton text=
'点击存储数据_我是老王'
onPress={
this
._saveValue_One}/>
<CustomButton text=
'点击删除数据'
onPress={
this
._removeValue_One}/>
<Text style={styles.content}>信息为:</Text>
{
this
.state.messages.map((m) => <Text style={styles.content} key={m}>{m}</Text>)}
</View>
);
}
}
const styles = StyleSheet.create({
welcome: {
fontSize: 14,
textAlign:
'left'
,
margin: 10,
},
content:{
fontSize: 13,
textAlign:
'left'
,
margin: 10,
},
button: {
margin:5,
backgroundColor:
'white'
,
padding: 15,
borderBottomWidth: StyleSheet.hairlineWidth,
borderBottomColor:
'#cdcdcd'
,
}
});
AppRegistry.registerComponent(
'AsyncStorageDemo'
, () => AsyncStorageDemo);
