在任何一个购物页面，只要购买了商品，就可以将购买量存储到缓存，实现跨页面共享数据。这个原理也可以用来管理其它较复杂的跨页面结构。

demo地址：

• 使用js-storage这个js库来实现对localstorage的读写及判断，比自己写原生要简单。因为localstorage默认存储是字符形式，如果要存储对象、数据这些，还要自己写转换，用库就简单得多了。另外还用isEmpty对“空结构”做判断。
• 基于VUE做了一个单独的mixin_cart，要引入购物车的页面都可以使用这个mixin
• 用一个数据结构(cart)来完整的映射“购物车”,针对它写了一些API:

• init_cart----从local读数据来形成cart
• get_cart_item_count----得到某件商品的购买量
• write_cart------新建/改写商品数据
• sum_cart-------汇总购买量
• clear_cart------待加
• 使用watch监听页面中的数据变化，一旦发生变化，就扫描数据结构，把购买量的变化使用write_cart映射到cart-->并存储到localstorage。注意watch监听数组或是对象这样的复杂结构，要使用handler+deep: true写法。
• 一些算法使用了lodash.js，比如：
  • 查找符合条件的商品-- _.find
  • 从数组中删除商品---_.pull
  • 汇总商品购买量------_.sumBy

文章来自: 本站原创
引用通告: 查看所有引用 | 我要引用此文章
Tags:
相关日志: