reactNative 学习之AsyncStorage

AsyncStorage是一个简单的、异步的、持久化的Key-Value存储系统,它对于App来说是全局性的。它用来代替LocalStorage
效果图如下

屏幕快照 2017-07-20 下午4.32.32.png
屏幕快照 2017-07-20 下午4.33.16.png

代码:

/**
 * Created by sunbiao on 2017/7/20.
 */
import React, {Component} from 'react';
import {
    StyleSheet,
    View,
    AsyncStorage,
    Button,
    Alert,
    Text,
    TextInput,
} from 'react-native';
export default class AsyncStorageDemo extends Component {
    // 构造
      constructor(props) {
        super(props);
        // 初始状态
        this.state = {
            key:'a',
            value:'1',
            data:'',
        };
        this._catchError=this._catchError.bind(this);
      }

      _addData(){
          AsyncStorage.setItem(this.state.key,this.state.value,(error)=>this._catchError(error))
      }
      _catchError(error){
          if (error == null){
              Alert.alert('success')
          } else {
              Alert.alert('falure')
          }
      }
      _getData(){
          var  that = this;
            AsyncStorage.getItem(this.state.key,(error,result)=>{
                if (error == null){
                    Alert.alert('key:'+this.state.key+'  value:'+result)
                } else {
                    Alert.alert('falure')
                }
            })
      }
      _getAllkey(){
          this.setState({data: ''});
            AsyncStorage.getAllKeys(
                (error,keys)=>{
                    if (keys && keys.length>0){
                        keys.map((key, i)=>{
                            AsyncStorage.getItem(key,(error,result)=>{

                                if (error==null) {
                                   var data= 'key:'+this.state.key+'  value:'+result;
                                   Alert.alert(data)
                                    this.setState({
                                        data:data
                                    })
                                }
                            })
                        })
                    }
                }
            )
      }
      _removeData(){
          AsyncStorage.removeItem(this.state.key,(error)=>{
              if (error == null){
                  Alert.alert('success')
              } else {
                  Alert.alert('falure')
              }
          })
      }
      render(){
          return(
              <View style={{flex:1,margin:20}}>
             
                  <Button title='store' onPress={this._addData.bind(this)}/>
                  <Button title='getData' onPress={this._getData.bind(this)}/>
                  <Button title='AllData' onPress={this._getAllkey.bind(this)}/>
                  <Button title='remove' onPress={this._removeData.bind(this)}/>
             </View>
          );
      }
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,026评论 19 139
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,699评论 25 708
  • 1. Java基础部分 基础部分的顺序:基本语法,类相关的语法,内部类的语法,继承相关的语法,异常的语法,线程的语...
    子非鱼_t_阅读 31,780评论 18 399
  • *面试心声:其实这些题本人都没怎么背,但是在上海 两周半 面了大约10家 收到差不多3个offer,总结起来就是把...
    Dove_iOS阅读 27,219评论 30 472
  • 做事要有动机,如果没有动机那就是冲动,冲动只是三分钟热度,但是不会持续。 动机分成三个层次。 我们的天性决定我们会...
    迷至自信阅读 270评论 1 3