rn 第三方存储库react-native-storage整合异步存储组件Storage

1、安装yarn add react-native-storageyarn add @react-native-community/async-storage2、导入import Storage from 'react-native-storage';import AsyncStorage from '@react-native-community/async-storage';3、创建库const storage = new Storage({最大存储多少条数据size: 1000,存储引擎,指定后会存储到app中storageBackend: AsyncStorage, // for web: window.localStorage数据保存时间defaultExpires: 1000 * 3600 * 24,读取时在内存中缓存数据enableCache: true,当storage中没有响应数据或已过期,会调用该方法该方法可以通过storage.sync直接修改、require('引入其他文件写好的')sync: {}});4、将库实例添加到全局,在App.js中引入该文件即可创建全局属性，任意位置都可以调用该实例global.storage = storage;5、保存
方式一:根据key存储storage.save({key:'xx', 	不能使用下划线,key永远存在,不受过期时间影响data:{键值对},expires:1000*3000 如果未设置则使用实例对象中的时间戳,null表示永久保存})方式二:根据id和key存储storage.save({key: 'xx', 不能有下划线id: 'xxx', 不能有下划线data: {...},expires: 1000 * 60});6、读取
方式一:根据key读取storage.load({key:'xx',没有读取到数据,调用sync方法autoSync:true,默认为false,等待sync方法提供最新的数据,true,在调用sync方法的同时返回过期的数据,即从本地获取数据syncInBackground:true,给sync方法传递额外的参数syncParams:{extraFetchOptions:{各种参数},someFlag:true}}).then((res)=>{会将data中的数据放在第一个参数里res.data中的键名}).catch(err => {捕捉没有找到数据且没有sync方法,或者其他异常console.warn(err.message);switch (err.name) {case 'NotFoundError':// TODO;break;case 'ExpiredError':// TODObreak;}});方式二:根据key和id读取storage.load({key: 'xx',id: 'xxx'}).then(ret => {console.log(ret.userid);}).catch(err => {console.warn(err.message);switch (err.name) {case 'NotFoundError':break;case 'ExpiredError':break;}});方式三:读取key对应的所有id,只针对设置了id的信息storage.getIdsForKey('xx').then(ids => {console.log(ids);});方式四:读取设置了id的所有key为xx的所有信息storage.getAllDataForKey('user').then(users => {console.log(users);});方式五:清除设置了id,所有key为xx的所有信息storage.clearMapForKey('user');方式六:根据一组id-key/key读取数据storage.getBatchData([{ key: 'loginState' },{ key: 'checkPoint', syncInBackground: false },{ key: 'balance' },{ key: 'user', id: '1009' }]).then(results => {results.forEach(result => {console.log(result);})})方式七:根据一组id读取数据storage.getBatchDataWithIds({key: 'user',ids: ['1001', '1002', '1003']}).then( ... )7、删除删除key下的所有内容storage.remove({key: 'xx'});删除key下的指定内容storage.remove({key: 'xx',data中的键名:对应的值});删除所有设置了key-id的内容storage.clearMap();

代码示例:

import React,{Component} from 'react'
import {View,Text,StyleSheet} from 'react-native'import Storage from 'react-native-storage';
import AsyncStorage from '@react-native-community/async-storage';//创建库
const storage = new Storage({// 最大存储多少条数据size: 1000,//存储引擎,指定后会存储到app中storageBackend: AsyncStorage, // for web: window.localStorage//数据保存时间defaultExpires: 1000 * 3600 * 24,// 读取时在内存中缓存数据enableCache: true,//当storage中没有响应数据或已过期,会调用该方法//该方法可以通过storage.sync直接修改、require('引入其他文件写好的')sync: {// we'll talk about the details later.}});//创建全局属性，任意位置都可以调用该实例global.storage = storage;export default class App extends Component{UNSAFE_componentWillMount(){//保存storage.save({key:'set', //不能使用下划线,key永远存在,不受过期时间影响data:{name:'jeff',pass:'123'},expires:1000*3000 //如果未设置则使用实例对象中的时间戳,null表示永久保存})}componentDidMount(){//读取storage.load({key:'set',//没有读取到数据,调用sync方法autoSync:true,//默认为false,等待sync方法提供最新的数据//true,在调用sync方法的同时返回过期的数据syncInBackground:true,//给sync方法传递额外的参数syncParams:{extraFetchOptions:{//各种参数},someFlag:true}}).then((res)=>{//会将data中的数据放在第一个参数里alert(res.name)}).catch(err => {//捕捉没有找到数据且没有sync方法,或者其他异常console.warn(err.message);switch (err.name) {case 'NotFoundError':// TODO;break;case 'ExpiredError':// TODObreak;}});}componentWillUnmount(){//删除key下的所有内容storage.remove({key: 'set'});//删除key下的指定内容storage.remove({key: 'set',pass:'123'});}render(){return(<></>)}
}

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！