ReactNative (API)AsyncStorage存储详解及实例

2019-12-12 05:07:13

字体：大中小

来源：转载

供稿：网友

AsyncStorage存储类似Android中的sharedpreference存储或者IOS中的NSDefaultUser不过ReactNative中的AsyncStorage只能存储字符串类型

这里写图片描述

常用方法：

getItem(key:string,callback?:?(error:?Error,result:?string)=>void) 静态方法，该通过key字段来进行查询存储的数据，把该结果值作为参数传入第二个callback方法。如果发生错误，会把Error对象传入callback方法。该方法最终返回一个Promise对象

setItem(key:string,value:string,callback?:?(error:?Error)=>void) 静态方法，该根据key字段设置value内容，完成之后进行回调callback方法。如果发生错误会把Error对象传入callback方法中。该方法返回一个Promise对象。

removeItem(key:string,callback?:?(error:?Error)=>void) 静态方法，根据key进行删除值，成功之后进行回调callback方法。如果发生错误会把Error对象传入callback方法中。该方法返回一个Promise对象。

/** * Created by Administrator on 2016/9/12. */import React, {Component} from 'react';import {  StyleSheet,  View,  Text,  AsyncStorage} from 'react-native';var keyName = 'name';var keyValue = '张三';class AsyncStorageG extends Component {  constructor(props) {    super(props);    this.state = {      result: '初始值'    };  }  render() {    return (      <View style={{flex: 1}}>        <Text          style={styles.text}          onPress={this.save.bind(this)}>存</Text>        <Text          style={styles.text}          onPress={()=>this.load()}>取</Text>        <Text          style={styles.text}          onPress={()=> this.remove()}>删除</Text>        <Text          style={styles.text}        >存储的内容是------------------{this.state.result}</Text>      </View>    )  }  /**   * 存数据   */  save() {    //this 是指当前对象    this2 = this;    AsyncStorage.setItem(keyName, keyValue, function (error) {      if (error) {        alert('存储失败');      } else {        this2.setState(          {            result: '数据已经保存，取出来看看吧！！！'          }        )      }    })  }  /**   * 取数据   */  load() {    //this 是指当前对象    this2 = this;    AsyncStorage.getItem(keyName, function (error, result) {      if (!error) {        this2.setState(          {            result: result === null ? '数据已经删除，现在取的是空值' : result          }        )      }    })  }  /**   * 两个参数：   * 一个是要删除指定key内容   * 第二个是一个回调函数   */  remove() {    //this 是指当前对象    this2 = this;    AsyncStorage.removeItem(keyName, function (error) {      if (!error) {        this2.setState(          {            result: '数据已经删除'          }        )      }    })  }}const styles = StyleSheet.create({  text: {    fontSize: 20  }});//es6写法export default AsyncStorageG;

感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！

上一篇：ReactNative Alert详解及实例代码

下一篇：React-Native TextInput组件详解及实例代码