SAP Spartacus 如何使用 API 从浏览器 local Storage 读取数据

如下图所示,SAP 电商云 UI,用户的购物车 ID,持久化在浏览器的 local storage 里:

SAP Spartacus 如何使用 API 从浏览器 local Storage 读取数据

运行时,通过封装好的函数 getStorage 读取:

SAP Spartacus 如何使用 API 从浏览器 local Storage 读取数据

为什么会触发 State module 的加载?
SAP Spartacus 如何使用 API 从浏览器 local Storage 读取数据

并没有直接用到 StateModule:
SAP Spartacus 如何使用 API 从浏览器 local Storage 读取数据

默认使用 local storage:
SAP Spartacus 如何使用 API 从浏览器 local Storage 读取数据

新建一个 subscription,自执行:
SAP Spartacus 如何使用 API 从浏览器 local Storage 读取数据

上图代码的逻辑:

SAP Spartacus 如何使用 API 从浏览器 local Storage 读取数据

unsubscribe 之后仍然可以 subscribe,为啥?
SAP Spartacus 如何使用 API 从浏览器 local Storage 读取数据

对于 interval 产生的 Observable 来说,可以被 unsubscribe.

SAP Spartacus 如何使用 API 从浏览器 local Storage 读取数据

最后用的是浏览器的原生 API 读取 local storage 数据:
SAP Spartacus 如何使用 API 从浏览器 local Storage 读取数据

代码第 47 行的 storage 引用,来自函数 getStorage,从 winRef 获取:

SAP Spartacus 如何使用 API 从浏览器 local Storage 读取数据

winRef 通过依赖注入生成:
SAP Spartacus 如何使用 API 从浏览器 local Storage 读取数据

winref 包含了 Spartacus 团队针对 Document 的一个封装:

SAP Spartacus 如何使用 API 从浏览器 local Storage 读取数据

直接利用 Angular 标准的 injection token 来检测运行环境是浏览器还是服务器:
SAP Spartacus 如何使用 API 从浏览器 local Storage 读取数据

更多Jerry的原创文章,尽在:“汪子熙”:
SAP Spartacus 如何使用 API 从浏览器 local Storage 读取数据

上一篇:博客园界面美化三角动画、github链接和小火箭置顶代码


下一篇:如何在 SAP 电商云 Spartacus UI 里新建一个页面