AsyncStorage是一个简单的、异步的、持久化的 Key-Value 存储系统，它对于 App 来说是全局性的。有一个极大的缺点就是：只可以存储字符串。也就是说，如果需要将对象或者数组等存入到AsyncStorage中需要先将他们转为字符串。

一、增加

 AsyncStorage.setItem('text', '葫芦小金刚', (error) => {
            error ? this.setState({ text: '增加失败' }) : this.setState({ text: '增加成功' })
          })

二、删除

AsyncStorage.removeItem('text',(error)=>{
            error ? this.setState({ text: '删除失败' }) : this.setState({ text: '删除成功' })
          })

三、更改

AsyncStorage.setItem('text', '爷爷',(error)=>{
            error ? this.setState({ text: '更改失败' }) : this.setState({ text: '更改成功' })
          })

四、查询

 AsyncStorage.getItem('text').then((value) => {
            if (value) {
              this.setState({
                text: value,
              })
            }else{
              this.setState({
                text:'啥也没存'
              })
            }
          })

五、上代码

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


export default class TestPages extends React.Component {
  constructor(props) {
    super(props)
    this.state = {
      text: '啥也没有',
    }
  }
  render() {
    return (
      <View style={styles.view}>
        <Text style={styles.text}>
          {this.state.text}
        </Text>

        {/* 增加 */}
        <TouchableOpacity style={styles.touch} onPress={() => {
          AsyncStorage.setItem('text', '葫芦小金刚', (error) => {
            error ? this.setState({ text: '增加失败' }) : this.setState({ text: '增加成功' })
          })
        }}>
          <Text>增加</Text>
        </TouchableOpacity>
        {/* 删除 */}
        <TouchableOpacity style={styles.touch} onPress={() => {
          AsyncStorage.removeItem('text',(error)=>{
            error ? this.setState({ text: '删除失败' }) : this.setState({ text: '删除成功' })
          })
        }}>
          <Text>删除</Text>
        </TouchableOpacity>
        {/* 更改 */}
        <TouchableOpacity style={styles.touch} onPress={() => {
          AsyncStorage.setItem('text', '爷爷',(error)=>{
            error ? this.setState({ text: '更改失败' }) : this.setState({ text: '更改成功' })
          })
        }}>
          <Text>更改</Text>
        </TouchableOpacity>
        {/* 查询 */}
        <TouchableOpacity style={styles.touch} onPress={() => {
          AsyncStorage.getItem('text').then((value) => {
            if (value) {
              this.setState({
                text: value,
              })
            }else{
              this.setState({
                text:'啥也没存'
              })
            }
          })
        }}>
          <Text>查询</Text>
        </TouchableOpacity>


      </View>
    )
  }
}

const styles = StyleSheet.create({
  view: {
    backgroundColor: '#fff',
    width: '100%',
    height: '100%',
    flexDirection: 'column',
    justifyContent: 'center',
    alignItems:'center',
  },
  touch: {
    width: 100,
    height: 50,
    marginTop:50,
    backgroundColor: '#0f0',
    display: 'flex',
    justifyContent: 'center',
    alignItems: 'center',
  },
  touchText: {
    fontSize: 20,
    color: '#000',
  }
});

六、总结

AsyncStorage最大的缺点就是只能存储字符串，因此，在存储对象或数组的时候需要将它们转成字符串的形式存入，这样很不方便。相比之下mobx更具有优势，建议取而代之。

不过，AsyncStorage也有它的好处，例如在开发APP的时候，需要设计这么一个功能：用户登录一次后无需每次登录，这就需要将用户的相关信息持久化的存储在AsyncStorage中。

本来想放一个演示在这，结果电脑上没有相关的视频转gif软件，后续更新吧。祝成功！