[RN] React Native 使用 AsyncStorage 存储 缓存数据
React Native 使用 AsyncStorage 存储 缓存数据
AsyncStorage是一个简单的、异步的、持久化的Key-Value存储系统,它对于App来说是全局性的。这是官网上对它的介绍。可以知道,这个asyncstorage也是以键值对的形式进行存储数据的。 那么问题来了,该怎么使用这个呢?官网上说并不推荐我们直接用这个asyncstorage,而是进行抽象封装以后在进行调用。
封装类 StorageUtil.js 代码如下:
import {AsyncStorage} from 'react-native';
class StorageUtil {
/**
* 获取
* @param key
* @returns {*|Promise<*>|PromiseLike<T | never>|Promise<T | never>}
*/
static get(key) {
return AsyncStorage.getItem(key).then((value) => {
const jsonValue = JSON.parse(value);
return jsonValue;
});
}
/**
* 保存
* @param key
* @param value
* @returns {*}
*/
static save(key, value) {
return AsyncStorage.setItem(key, JSON.stringify(value));
}
/**
* 更新
* @param key
* @param value
* @returns {*}
*/
static update(key, value) {
return AsyncStorage.setItem(key, JSON.stringify(value));
}
/**
* 删除
* @param key
* @returns {*}
*/
static delete(key) {
return AsyncStorage.removeItem(key);
}
/**
* 删除所有配置数据
* @returns {Promise<string>}
*/
static clear() {
return AsyncStorage.clear();
}
}
export default StorageUtil;
使用代码:
let key = 'per';
let person = "hello"; //保存
StorageUtil.save(key, person); //获取
StorageUtil.get(key).then((row)=>{
if(row){
console.log(row)
}else{
console.log("null")
} }); //更新
let person2 = "广州";
StorageUtil.update(key, person2); // StorageUtil.delete(key); //清除所有
StorageUtil.clear(); StorageUtil.get(key).then((row)=>{
if(row){
alert(row);
console.log(row)
}else{
console.log("null")
}
});
本博客地址: wukong1688
本文原文地址:https://www.cnblogs.com/wukong1688/p/10958297.html
转载请著名出处!谢谢~~
[RN] React Native 使用 AsyncStorage 存储 缓存数据的更多相关文章
- [RN] React Native 实现图片预览
[RN] React Native 实现图片预览 效果预览: 代码如下: 'use strict'; import React, {Component} from 'react'; import {I ...
- [RN] React Native 常见基本问题归纳总结
[RN] React Native 常见基本问题归纳总结 本问题总结涉及到版本为: "react": "16.8.3","react-native& ...
- [RN] React Native 关闭所有黄色警告
[RN] React Native 关闭所有黄色警告 console.ignoredYellowBox = ['Warning: BackAndroid is deprecated. Please u ...
- [RN] React Native 下实现底部标签(支持滑动切换)
上一篇文章 [RN] React Native 下实现底部标签(不支持滑动切换) 总结了不支持滑动切换的方法,此篇文章总结出 支持滑动 的方法 准备工作之类的,跟上文类似,大家可点击上文查看相关内容. ...
- [RN] React Native 幻灯片效果 Banner
[RN] React Native 幻灯片效果 Banner 1.定义Banner import React, {Component} from 'react'; import {Image, Scr ...
- [RN] React Native 常用命令行
[RN] React Native 常用命令行 1.查看当前版本 react-native --version 或 react-native -v 2.创建指定版本的React Native项目 1) ...
- [RN] React Native 实现 类似QQ 登陆页面
[RN] React Native 实现 类似QQ 登陆页面 一.主页index.js 项目目录下index.js /** * @format */ import {AppRegistry} from ...
- React Native之持久化存储(AsyncStorage、react-native-storage)的使用
AsyncStorage是一个简单的.异步的.持久化的Key-Value存储系统,它对于App来说是全局性的.这是官网上对它的介绍.可以知道,这个asyncstorage也是以键值对的形式进行存储数据 ...
- [RN] React Native 获取地理位置
React Native 获取地理位置 实现原理: 1.用 navigator.geolocation.getCurrentPosition 获取到坐标信息 2.调用 高德地图 接口,解析位置数据 ...
随机推荐
- 简洁的 Python Schema
目录 Python Schema使用说明 1. Schema是什么? 2. 安装 1. 给Schema类传入类型(int.str.float等) 2. 给Schema类传入可调用的对象(函数.带__c ...
- Java中使用OpenSSL生成公钥私钥进行数据加解密
当前使用的是Linux系统,已经安装OpenSSL软件包. 一.使用OpenSSL来生成私钥和公钥1.执行命令openssl version -a 验证机器上已经安装openssl $ openssl ...
- Static and Instance Methods in JavaScript
class.method/instance method https://abdulapopoola.com/2013/03/30/static-and-instance-methods-in-jav ...
- 对比度增强(二):直方图正规划与伽马变换 cv.normal()函数使用及原理
直方图正规化: 图像为I,宽为W,高为H,I(r,c)代表I的第r行第c列的灰度值:输出图像记为O,为使得输出图像的灰度值在[Omin,Omax]范围里,可用如下公式: ...
- 在浏览器中输入 url 地址到显示主页的过程
总体来说分为以下几个过程:1. DNS 解析2. TCP 连接3. 发送 HTTP 请求4. 服务器处理请求并返回 HTTP 报文5. 浏览器解析渲染页面6. 连接结束
- Django--母版
目录 母版 语法 案例 在之前的两个小程序中,可以发现在写html页面的时候有很多重复的代码 而在python中,为了避免写重复代码,我们通过函数.模块或者类来进行实现,所以在Django里面也有这样 ...
- python数据分析三剑客之: pandas操作
pandas的操作 pandas的拼接操作 # pandas的拼接操作 级联 pd.concat , pd.append 合并 pd.merge , pd.join 一丶pd.concat()级联 # ...
- js查询手机号码格式是否正确
直接上代码,复制开用 let regExp = /^([-]{,}\-)?[-]{,}$|^?[|||7||][-]\d{}$/; //验证的手机号码格式 //this.ruleForm.adminC ...
- jquery设置css,animate设置多个属性
$("p").css("color","red"); $("p").css({ "font-size" ...
- 面试题:栈的push和pop序列是否一致
参数是两个数组,arr1,arr2 stack stack = new Stack() for(int i=0;j=0;i<arr1.length;i++){ stack.push(arr[i] ...