购物车功能分析
简易购物车模板:
https://pan.baidu.com/s/16LsdpXSOHZxek50tbCeAcQ
大致功能如下:
0. mock.js
- 全选框
- 商品的数量增减,数量为1 减失效
- 商品删除
- 单个商品总价计算
- 所有商品总价计算
- 。。。。。。。。
mock.js
1.我打开mock.js之后发现他八千多行…然后我尝试着注释掉它看看有什么变化没…
![在这里插入图片描述](https://img-blog.csdnimg.cn/2019090216531575.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RvdWRvdV9uYw==,size_16,color_FFFFFF,t_70)
…然后我去搜了搜
![在这里插入图片描述](https://img-blog.csdnimg.cn/20190902165136329.png)
通过只言片语,敏锐的意识到了詹老师导入这1w行…应该是用来造了数据,然后用上了AJAX。utils.js文件里就是ajax获取数据
![在这里插入图片描述](https://img-blog.csdnimg.cn/20190902165951172.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RvdWRvdV9uYw==,size_16,color_FFFFFF,t_70)
数据肯定是在产品里嘛
打开目录里的products.js
![在这里插入图片描述](https://img-blog.csdnimg.cn/20190902165822940.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RvdWRvdV9uYw==,size_16,color_FFFFFF,t_70)