react native bundle读取assets_react-native-easy-app 详解与使用之 (一)AsyncStorage
react-native-easy-app 是一款为React Native App快速开发提供基础服务的纯JS库(支持 IOS & Android),特别是在从0到1的项目搭建初期,至少可以为开发者减少30%的工作量。
react-native-easy-app 主要做了这些工作:1. 对AsyncStorage进行封装,开发者只需几行代码即可实现一个持久化数据管理器。2. 对fetch进行封装,使得开发者只需关注当前App的前后台交互逻辑和协议,定义好参数设置及解析逻辑即可。3. 重新封装了RN的View、Text、Image、FlatList 使用得这些控件在适当的时候支持事件或支持icon与文本,能有效减少布局中的嵌套逻辑。4. 通过设置一个屏幕参考尺寸,重置XView、XText、XImage的尺寸,实现自动多屏适配。
可能有人觉得,RN的AsyncStorage本身就很简单,自己封装也就几十行代码的工作量,为什么还要使用第三方库?
一千个人心中,有一千个哈姆雷特,也许我的封装思路能给你带来不一样的启发也未可知呢?
数据存储(AsyncStorage)
RN平台提供的AsyncStorage有一些基础方法:setItem,getItem,removeItem,getAllKeys,这些是promise模式的并且AsyncStorage只支持对纯字符串的存取,因此我们不便于直接在代码中去直接调用这些方法,我们得对AsyncStorage做一次封装,怎样封装能使我们更方便快捷的访问本地存取呢?
我们来看下通过 react-native-easy-app 库的XStorage,我们可以怎样访问AsyncStorage:
1、核心代码实现
import
执行完上面的代码后我们看看控制台输出:
再通过Root Explorer 查看一下当前App的data/data/{package}/database 下数据表的内容:
什么?上面的代码中并没有做任何数据库的存储操作啊,为什么赋值给RNStorage的数据却被存到了本地数据库中呢?我们先看上面的代码中做了什么:
- 定义了一个自定义对象RNStorage
- 将自定义对象传给XStorage.initStorage 进行初始化
- 在初始化完成后对RNStorage的属性进行了赋值
- 打印RNStorage的内容
由此可见,数据的存储操作必定是上面的第2、3步引起的。我们进入XStorage的源码看看,里面做了什么:
- 源代码 1
Object
- 源代码 2
const
哦,原来 XStorage 通过getter、setter生成器,将用户自定义的 RNStorage 的各属与 AsyncStorage 的数据表各字段的值进行了关联形成了一个绑定关系,在当用户对 RNStorage 的各属性进行赋值、取值操作的时候,实际上会触发getter、setter生成器,相应的会对 AsyncStorage 中的数据表进行读写操作。
效率与性能的平衡
- <读> 在初始化XStorage的时候就将AsyncStorage中的所有字段一次性读取到 RNStorage 对象中,以后续读取属性时,并不需要经过AsyncStorage,而是直接返回 RNStorage的属性。
- <写> 在开发者修改XStorage的属性值时,会先将目标数据赋值给XStorage的属性,然后再异步通过AsyncStorage将目标数据写入到数据库中(考虑到数据写入的效率与性能问题,目前的处理方式为:每次数值的变更都会记录下来,定时程序每隔2.5秒进行一次数据批量写入操作),但这个丝毫不会影响App对数据的操作,因为RNStorage中的数据是实时且同步的。
至此就完全清楚了,是不是很简单?开发者通过 react-native-easy-app 只需定义一个全局可导出的 RNStorage对象(命名随意,并定义好App所需的各属性字段),然后在App启动的时候通过XStorage初始化一次RNStorage即可,以后直接访问RNStorage中的属性值就行了(所有对RNStorage属性的修改都会被自动同步到AsyncStorage中),完全是一劳永逸啊。。。
react-native-easy-app 详解与使用之(二) fetch
想进一步了解,请移步至 npm 或github查看 react-native-easy-app,有源码及使用示例,待大家一探究竟,欢迎朋友们 Star!
如果有任何疑问,欢迎扫码加入RN技术QQ交流群
https://qm.qq.com/cgi-bin/qm/qr?k=-pcDIMs-yvDL5Hdltche1rMeaDXuOOgV&authKey=PucGk7v39qRlVRaavwbauJRqtpSag4qGGT5HeBQ5veiJPz/beDADeOgIH904CxhK&noverify=0 (二维码自动识别)
react native bundle读取assets_react-native-easy-app 详解与使用之 (一)AsyncStorage相关推荐
- php中读取大文件实现方法详解
php中读取大文件实现方法详解 来源: 时间:2013-09-05 19:27:01 阅读数:6186 分享到:0 [导读] 本文章来给各位同学介绍php中读取大文件实现方法详解吧,有需要了解 ...
- python医学图像读取_对python读取CT医学图像的实例详解
需要安装OpenCV和SimpleItk. SimpleItk比较简单,直接pip install SimpleItk即可. 代码如下: #coding:utf-8 import SimpleITK ...
- 【TensorFlow】TFRecord数据集的制作:读取、显示及代码详解
在跑通了官网的mnist和cifar10数据之后,笔者尝试着制作自己的数据集,并保存,读入,显示. TensorFlow可以支持cifar10的数据格式, 也提供了标准的TFRecord 格式. te ...
- TensorFlow学习笔记(二十四)自制TFRecord数据集 读取、显示及代码详解
在跑通了官网的mnist和cifar10数据之后,笔者尝试着制作自己的数据集,并保存,读入,显示. TensorFlow可以支持cifar10的数据格式, 也提供了标准的TFRecord 格式,而关于 ...
- linux权限可被登录用户读取,Linux 用户及权限详解
Linux 用户及权限详解 用户 , 组 ,权限 安全上下文(secure context): 权限: r,w,x 文件: r : 可读,可以使用类似cat 等命令查看文件内容. w : 可写,可以编 ...
- 网络中的pvid与native vlan(本征vlan)区别以及详解
一:pvid与native vlan分别属于华为和思科交换里面的概念,虽然说法不同,但是本质都是缺省vlan 缺省vlan默认为1,各个端口都有一个缺省的vlan,该值支持修改. 2.作用概念,pvi ...
- 【Java实战】微信Native扫码支付(主扫)开发详解
文章目录 前言 一.功能实现 1.前置条件 2.代码实现 二.具体步骤 1.直接调用微信接口 2.基于binarywang对接 2.1.引入依赖 2.2.编写配置类 2.3.编写后台方法 总结 前言 ...
- react结合ts与mobx环境搭建步骤详解
由于react ts mobx 版本上的更新,一些配置信息也在随时更新,使得有时候,在更新版本时,一些配置文件出错,让我们措手不及,现将三者环境搭建配上,废话不多说 思路:新建react 应用,利用弹 ...
- 怎么利用迭代器写入mysql_流迭代器实现文件操作(读取和写入)方法详解
流迭代器并不知道底层流的特性.当然,它们只适用于文本模式,否则它们不会关心数据是什么.流迭代器可以以文本模式来读写任何类型的流.这意味着除了其他的一些流之外,我们可以用迭代器以文本模式来读和写文件.在 ...
最新文章
- 每日一皮:一个难以复现的 bug ...
- (转)Java并发编程:线程池的使用
- iOS轻量分组日志工具 Log4OC
- Angular自学笔记(?)依赖注入
- 在职场中,长得漂亮真的有用吗?
- lua调用c 模块linux,Lua 调用自定义C模块
- 女生可以学计算机应用吗,我是女生 学计算机应用技术还是软体技术
- 安装VMWare tools 及安装后/mnt中有hgfs但没共享文件的解决办法
- Struts1.x系列教程(19):LookupDispatchAction类处理一个form多个submit
- http://snaps.php.net,科技常识:Windows下编译PHP和memcache扩展教程
- ValidationKey
- k380没有验证码_罗技K380蓝牙键盘
- # 关于Dran,Cran,CloundRan ,的区别
- 英语发音规则---L字母
- 非root用户安装命令
- C语言设计流水灯程序,花式流水灯c语言程序.pdf
- python画多个圆_我如何用pythonturtle画一个中间有一个圆的圆圈?
- 极客大挑战 2021
- git检出新分支遇到的文件路径过长Filename too long的问题
- 基于socket.io的php扩展介绍---phpsocket.io
热门文章
- Mabatis(2) 全局配置文件
- java 练习6 交通工具
- LeetCode : Binary Tree Paths
- java中抽象的(abstract)方法是否可同时是静态的(static),是否可同时是本地方法(native),是否可同时被synchronized修饰...
- sql语句,怎么取查询结果的位置
- [转]Spring数据库读写分离
- sqlserver limit
- Laravel 配置
- uboot环境变量及常用命令
- IGNN图卷积超分网络:挖掘隐藏在低分辨率图像中的高清纹理