H5的localStorage实现购物车功能

使用LocalStorage实现购物车功能

 

 

    一:明确功能需求

            通京东购物商城思考购物车的相关特性。(淘宝有所不同)

                 在我们使用购物车时,需要注意的是关于购物车使用的时机:登录账号前、登录账号后。

                 我们会发现无论有没有登录账号,都能够往购物车中添加商品,即使当我们关闭浏览器后重新打开浏览器购物车中商

              品也还在;并且在登录账号之后,购物车中添加的商品并不会消失。

        通过这个我们可以考虑到,购物车中的商品信息我们是保存在我们本地的。

        这个我们用H5中的新特性LocalStorage来实现!

            主要需求:非登录状态添加购物车、登录后还持有非登录状态下的购物车信息。

    二:主要实现

        思路:

                在点击加入购物车是,将需要加入购物车的商品信息保存到LocalStorage中。包括商品的名称、价格以及添加时间等各类信息。

                并且购物车上面的显示商品个数的图标内容也随之改变。

                当登录账号后,进入个人购物车,购物车内商品信息从LocalStorage中获取,并插入到相关数据库表中。

                在完成之后,将本地LocalStorage内保存的信息清除掉。

    三:常见问题

猜你喜欢

转载自blog.csdn.net/qq_22596931/article/details/79915190