native数据类型 react_React-Native 之 数据持久化

前言

因为 实战项目系列 涉及到数据持久化，这边就来补充一下。

如本文有错或理解偏差欢迎联系我，会尽快改正更新！

如有什么问题，也可直接通过邮箱 277511806@qq.com 联系我。

数据持久化

数据持久化一直都是软件开发中重要的一个环节，几乎所有的应用都具备这一项功能；那什么是数据持久化呢？—— 说白了就是数据的本地化存储，将数据存储到本地，在需要的时候进行调用。

这边我们介绍两种在 React-Native 中比较常用的存储方式

AsyncStorage：这是官方使用的存储方式，类似于 iOS 中的 NSUserDefault ，区别在于，AsyncStorage 只能存储 字符串键值对，而 NSUserDefault 可以存储 字符串和number。

Realm：今天才发现 Realm 也已经支持 React-Native ,这是新兴的移动端数据存储方式，在没有它之前，一直都是使用 sqlist 进行数据存储，在性能上，各有优势，但是操作上，Realm 有着明显优势，更方便使用。

接下来我们就来看看怎么使用它们。

AsyncStorage 简单使用

AsyncStorage方法官方文档写得很详细，这边就不对赘述了！

AsyncStorage 使用方法很简单，我们就直接上代码：

// 增加

createData() {

AsyncStorage.setItem('name', JSON.stringify('吉泽明步'), (error, result) => {

if (!error) {

this.setState({

data:'保存成功!'

})

}

});

}

// 查询

inquireData() {

AsyncStorage.getItem('name')

.then((value) => {

let jsonValue = JSON.parse((value));

this.setState({

data:jsonValue

})

})

}

// 更新

upData() {

AsyncStorage.setItem('name', JSON.stringify('苍井空'), (error, result) => {

if (!error) {

this.setState({

data:'更新成功!'

})

}

});

}

// 删除

removeData() {

AsyncStorage.removeItem('name');

this.setState({

data:'删除完成!'

})

}

AsyncStorage效果演示.gif

按照官方推荐，我们使用 AsyncStorage 前，最好进行一层封装，React-Native中文网 给我们提供了一个比较好的框架 —— react-native-storage，我们可以直接使用它,方法很简单，说明文档中说得很详细。

既然是第三方框架，那么第一部肯定就是导入到我们的工程中：

npm install react-native-storage --save

接着，我们根据创建一个 Storage 文件专门对框架进行初始化操作：

import {

AsyncStorage,

} from 'react-native';

// 第三方框架

import Storage from 'react-native-storage';

var storage = new Storage({