# 模拟商城 **Repository Path**: miss_moon/simulation_mall ## Basic Information - **Project Name**: 模拟商城 - **Description**: 在线使用链接： - **Primary Language**: JavaScript - **License**: MIT - **Default Branch**: master - **Homepage**: http://sky19980208.gitee.io/simulation_mall/#/home - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 0 - **Created**: 2020-05-06 - **Last Updated**: 2021-04-18 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # 模拟商城 ## 项目链接 在线使用请点击：[模拟商城](http://sky19980208.gitee.io/simulation_mall/#/home) ## 项目简介 一个基于Vue全家桶开发的模拟电商项目，界面设计已经基本完成，完成了“商品浏览”和“加入购物车”等功能。 ## 项目功能 1. 这里是列表文本.通过axios请求服务器的首页轮播图等数据。并对整个项目都做了图片懒加载，保证项目的使用流畅性。 2. 利用scroll实现了移动端页面的流畅滑动，并且实现了“上拉加载更多”的功能。 3. 利用Mock.js实现了在本地模拟商品详情数据，使整个项目即使没有后台服务器的商品数据，也能很流畅的使用。 4. 利用FastClick解决了移动端300ms延迟的问题，改善了使用体验。 5. 合理利用Vuex和props进行各类组件之间的通信，从而实现了“加入购物车”的功能。 ## 项目总结 1. 这个项目是一个相比比较完整和大型的项目，里面实现了很多小功能，比如导航栏的“吸顶”效果，还有“返回顶部”按钮的实现等等。 2. 在做这个项目的时候，也遇到了很多问题，这是这个项目的一些踩坑记录：[踩坑记录](https://www.jianshu.com/p/006aae46f960) 3. 整个项目是历时相对较长，也是一边做一边学。同时也封装了很多公共组件和非公共组件，这样有利于我后续在开发其它项目的过程中，如果可以用封装好的公共组件，那就会大大减少开发时间。 4. 在整个过程中，感触最深的应该就是Vue的组件化开发思想了，这个项目应该是把Vue的组件化运用到了极致。封装了太多的组件。也为这个项目的后续更新提供了方便。这点值得我学习，后续在开发项目的过程中，也需要秉承组件化开发的思想，这样后期维护也会非常方便。 ## 项目截图 #### 首页截图 ![首页](https://images.gitee.com/uploads/images/2020/0506/200451_534dae02_5314813.png "1.PNG") ![分类](https://images.gitee.com/uploads/images/2020/0506/200523_5d072425_5314813.png "2.PNG") #### 商品详情页截图 ![商品](https://images.gitee.com/uploads/images/2020/0506/200539_d2c4d8b0_5314813.png "3.PNG") ![参数](https://images.gitee.com/uploads/images/2020/0506/200625_bf79bc1d_5314813.png "4.PNG") ![评论](https://images.gitee.com/uploads/images/2020/0506/200645_c76412e7_5314813.png "5.PNG") ![推荐](https://images.gitee.com/uploads/images/2020/0506/200707_746f8c46_5314813.png "6.PNG") #### 购物车页面截图 ![勾选](https://images.gitee.com/uploads/images/2020/0506/201003_75fa659f_5314813.png "7.PNG") ![全选](https://images.gitee.com/uploads/images/2020/0506/201118_b8892d32_5314813.png "8.PNG")