BUZ-缓存/状态管理
key
String 缓存名称
notSave
Boolean 是否不立即保存,默认false,详见save方法
1 |
|
save
将所有临时更改的缓存数据保存到SessionStorage会话缓存中,请根据自身需要决定是否存储会话缓存
1 |
|
clear
清除当前数据仓库中所有缓存数据慎用
1 |
|
storageHelper
BUZ默认提供一个helper,刚才我们看到了addWathcer例子,他是通过计算属性来实现JS相应Node节点的, 我们可以直接使用helper使用更少的代码实现刚才的例子。
依然在addWatcher例子中的A脚本基础上,我们不需要通过在B.js中设置计算属性,我们修改HTML
1 |
|
使用storageHelper可以直接从App.storage中读取缓存数据,若数据是响应式的它会自动监听变更广播。
对helper有兴趣的童鞋可以参考自定义指令/渲染
此方需要传入缓存的地址,你不需要担心缓存不存在而导致报错,内部通过层级读取,若上一层读取失败或 undefined则不会向下寻址,直接返回空。
高级用法
在管理一个前端项目时,你有没有为不同开发人员总是忘记移除缓存造成的内存泄漏而感到头疼呢? 你有没有因为不同开发人员设置缓存时名称过于随意而造成的缓存覆盖呢?接下来看下面的这个高级扩展。
设计方法:由于BUZ在项目中已经为你确定DDD设计理念,我们可以实现区域内的缓存独立使用,当跳出当前区域时 自动清除原区域所产生的所有缓存(除全局外),怎么做呢?
Storage在存储时会同时存放两份数据,一份是完整信息数据,一份是纯值数据,由于对象是引用关系,内存消耗而乎其微, 请继续往下看。
我们对外操作的都是Storage.data
,因为它就是我们真正的仓库数据,方便使用;在Storage中还存在一个 _data
变量,它除了存放了数据还存放了很多其它配置信息。
1 2 3 4 5 6 7 |
|
从上面源码可以看出,this._data[key]不是原缓存值,内部包含了value(缓存值)、param(自定义配置信息)、fragment(地址碎片,详见router)
在add方法中参数param就是上面代码的param,因此我们可以根据不同项目自定义缓存标识。
实践
自定义forever标识
在param中自定义forever Boolean,代表是否是永久缓存。
1 2 3 |
|
通过上面例子我们就给userInfo做了一个自定义属性。
监听Router跳转
建议先阅读Router 路由管理章节。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 |
|
通过上面例子即可实现跳出区域时清除原区域的所有非全局缓存数据。
https://github.com/ZhangChuanHui/BUZ
BUZ-缓存/状态管理相关推荐
- ASP.NET状态管理之六(缓存Cache)
ASP.NET状态管理之六(缓存Cache) ASP.NET 为您提供了一个强大的.便于使用的缓存机制,用于将需要大量服务器资源来创建的对象存储在内存中.缓存这些类型的资源会大大改进应用程序的性能. ...
- HTTP 协议入门 — (TCP/IP协议族、通信传输流、URI 与 URL 的区别、Cookie 状态管理、HTTP 支持的方法、状态码类别、HTTP 首部字段)
TCP/IP协议族 在介绍 HTTP 协议之前,我们先对 TCP/IP 协议族有个大概的了解,TCP/IP 协议从上到下主要分为应用层.传输层.网络层和数据链路层,各层的主要功能如下表所示: 协议层 ...
- vue从入门到进阶:Vuex状态管理(十)
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式.它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化. 在 Vue 之后引入 vuex 会进行自动 ...
- redux异步action_Redux数据状态管理
Redux 中文文档(https://www.redux.org.cn/) Redux入门教程(快速上手)(https://segmentfault.com/a/1190000011474522?fr ...
- 【分析总结】ASP.NET中的状态管理原理
HTTP协议是介于请求.响应的断开时网络协议,与连接式的网络协议不同,例如,与我们熟悉的TCP协议相比,客户端与服务器并没有持续的连接存在,在每一次会话之后,连接都会被断开,在下一次请求的时候客户端会 ...
- vue状态管理存取数据_vue状态管理vuex从浅入深详细讲解
1.vuex简介以及创建一个简单的仓库 vuex是专门为vue框架而设计出的一个公共数据管理框架,任何组件都可以通过状态管理仓库数据沟通,也可以统一从仓库获取数据,在比较大型的应用中,数据交互庞大的情 ...
- Vue状态管理vuex
转: https://www.cnblogs.com/xiaohuochai/p/7554127.html 前面的话 由于多个状态分散的跨越在许多组件和交互间各个角落,大型应用复杂度也经常逐渐增长.为 ...
- onmounted vue3_基于项目时间阐述vue3.0新型状态管理和逻辑复用方式
作者:Mingle 转发链接:https://mp.weixin.qq.com/s/iOq-eeyToDXJ6lvwnC12DQ 前言 背景:2019年2月6号,React 发布 「16.8.0」 版 ...
- Dapr牵手.NET学习笔记:状态管理之docker-compose发布
Dapr牵手.NET学习笔记:想入非非的服务调用 Dapr牵手.NET学习笔记:跨物理机负载均衡服务调用 Dapr牵手.NET学习笔记:用docker-compose部署服务 说明:为了给出demo的 ...
- 面向.NET开发人员的Dapr——状态管理
目录: 面向.NET开发人员的Dapr--前言 面向.NET开发人员的Dapr--分布式世界 面向.NET开发人员的Dapr--俯瞰Dapr 面向.NET开发人员的Dapr--入门 面向.NET开发人 ...
最新文章
- 4.1.7 文件共享
- numpy 矩阵乘法_NumPy 运算规则总结
- UE 材质编辑器快捷键
- 高级终端termux下载不了Python_利用termux下载某站受限的番剧
- python match函数返回值_Python中re.match函数起什么作用呢?
- Spring Boot项目出现 Invalid bound statement (not found):错误
- 第七篇 indicators(3)第三方指标库Ta-lib
- (软件)商标名称可用查询 申请
- 肖博老师高中数学必备知识点总结最全版
- blocked Queue
- java中微信公众号框架_java微信公众号开发框架包含哪些内容呢?为什么要使用框架...
- 在Xml中加注释的方法
- 什么是Java的灵魂?了解JVM的结构模型,生命周期,Java王朝虚拟机的更替,各家大厂虚拟机百花齐放
- ITSS是什么?申请ITSS信息技术服务运行维护标准符合性证书有什么用?
- Linux之关于文本编辑器
- 获取滑动条位置,动态调整对话框显示位置;为动态添加的button添加click事件
- linux运行级别及其含义,linux的运行级别及相应含义
- CSS+Java Script+HTML实现打飞机小游戏
- 第九章 9.3.4节练习 9.3.5节练习
- 机器学习-降维算法(MDS算法)