将购物车数据统一放在vuex中的state里面,他是一个数组,里面存放着商品信息,商品名字,商品ID,商品的数量,以及对应商品库存等信息
添加购物车数据的时候,这时候我们会吧商品的ID和名称获取到,这时候会去comit一下vuex里面的mutation里面的添加数据的方法,这时候会判断一下这个商品ID在不在state的商品信息里面,如果在的话这时候会把这一项的商品数量加一,如果没有就新建一个新的对象包含这些数据再push到购物车这个数组里面去,这个时候有个库存问题,会对比如果当前商品的数量大于这个库存,这时候会弹出信息,表示超出库存 并且return不让他数量+1.当点击减少的时候,购物车内每一项渲染的商品列表都有一项v-if,如果商品的数量小于等于0,这时候会弹出提示框是否删除,点击确定 会把数量变为0 并且v-if的值也为false。

Last modification:October 20th, 2019 at 09:59 pm
If you think my article is useful to you, please feel free to appreciate