1、蚂蚁商城是一套多用户大众电商端商城，主要开放移动端用户为广大群体，具备电商网站的基本功能实现2、 主要参与购物车，商品分类，商品列表，用户登录，token 验证，懒加载等各种功能的实现3、具体实现： 1）使用 vue 开发，实现多用户商城用户管理，商品浏览，用户登陆注册，购物车商品添加，增加删除合并计算等功能 2）使用 vue-cli 构建项目工程，使用 vue 脚手架对项目开发进行搭建，并确定代码开发中可能会用到的插件3）使用 vue-router 的路由进行单页面的跳转，商城各大模块之间的的路由跳转，使用路由元信息 meta 进行是否需要登录功能的验证，使用元信息对路由功能进行更为细致的守卫划分，同时与 token 信息进行联动的一个功能，做 token 的同时需要用到 sso 单点登录对新下发的 token ，并把上一次该用户登录所使用的 token 替换为本次新创建的 token ，使上次的 token 失效实现 sso 单点登录4）使用 vuex 进行对 vue 项目的整个状态管理，对于父传子，子传父，兄弟组件之间的组件传值通信进行更好的状态管理传值操作，使用 vuex的 state 属性对组件的基本数据进行存储，使用 getter 可以对组件之间传递的数据进行计算的操作，如果需要提交数据更新且同时为同步的情况下更多情况下使用的是 mutation 属性，如果需要异步操作就需要用到 action 数据，数据格式比较乱的情况下是需要使用 modules 属性进行模块化更简洁的开发，同时也更便于项目模块之间的管理，购物车的模块主要就是用到 getter 属性对多用户商城系统里面的商品进行数量价格的计算以及使用 vuex 进行对数量，id ，图片，标题等信息的存储，对店铺信息里面添加商品子信息，通过判断商品店铺信息进行是否添加新店铺或者添加进已有店铺对应的逻辑操作5）多用户商城的用户注册登录，使用 axios 进行后台接口的调用，通过判断账号在数据库中是否存在的方式来执行是否注册或者登录错误的逻辑验证，如果账号与密码验证成功，后台就会返回给用户一个存储在本地的时效性 token 令牌，通过使用 token 令牌时效性以及加密性等一系列的用户安全信息操作，如果没有该用户信息，就需要通过使用 npm 中的 svg-captcha 依赖自动生成图形验证码，判断用户输入的验证码与后台服务器发送的验证码是否一致来推送对应的 res 状态信息，验证成功之后会发送给用户一个手机验证码，最后确定是否注册成功6）商品路由信息懒加载功能：商品路由信息懒加载是根据屏幕滚动的一个时间去提前做出对应的判断逻辑，对路由的 params 中的 size和 page 等参数信息进行滑动的懒加载信息，对电脑性能进行优化的同时也提高用户的体验7）商品分享功能：使用 npm 中的 vue-canvas 进行对分享进行图片的绘制，使用 npm的 vue-qr 对分享的当前网站进行二维码的构造，对图片进行保存分享功能的实现8）使用组件通信传值的方式通过使用点击获取到点击对应的 id ，发送给封装好的 axios 应用进行接口调用的请求数据，对数据返回的 res 状态判定，使用v-for 遍历循环数据内容，并为每一个数据添加一个单独的对应 id 作为唯一的标识符 key ，使 difll 算法更快的渲染虚拟的 dom 前端技术