项目一 ：卖茶叶（小鹿线P4 课程 前后端一起的）

这是一个电商类项目，功能是比较多的， 从首页开始介绍：首页里面有涉及到插件的滑动，分类页面引入了betterScroll作为上下左右分类数据联动， 用到了keep-alive 和 nextTick n

一 真机测试 手机浏览器运行项目： 手机和电脑端 使用同一网络 或 同一wifi vue.config.js 文件 添加 host 自己电脑查询 ipconfig 的 ipv4地址 module.ex

后端 一 index.js 判断超过 60秒的时间函数 二 在加入购物车接口的时候用了一下getTokenTime 这个函数，并跟 更新数据库的 token 三 userQuery.js 设置toke

通过to.name 来限制： // 路由导航守卫 ==>全局守卫 router.beforeEach((to, from, next) => { let nextRoute = ["Cartlist"

请用无痕浏览器测试 状态参考：https://www.cnblogs.com/suiyisuixing/p/7467123.html 开始对接支付宝：返回支付链接（PC 支付接口 参考） https:

前端： // 提交订单： async submitOrder() { let res = await http.$axios({ url: "/api/updateOrderStatus", meth

进入支付宝沙箱环境：用自己的支付宝扫码登录 https://developers.alipay.com/dev/workspace/register?from=http%3A%2F%2Fopenhom

前端代码： oriderList 和 orderId 是通过购物车页面 去结算通过query传进来的，传进来的数据 放在兄弟组件中,否则不会实时刷新 购物车页面 去结算传参 接收query参数 后端

问题 this.$router.back() 和 this.$router.go() 返回上一页之前要把当前也的值传递过去，怎么传？看图第2 和 第3 步 利用兄弟之间传值 前端代码 一 提交订单页面

![支付流程（去结算生成订单号）.png](https://p6-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/10566baa6d2f42fcade5a6ce2366

前端->思路： 1.点击删除按钮：执行删除事件，采用的是vant组件中有删除事件， vant组件删除事件 默认有一个参数content ，就是前端地址相关信息,同时记得传递 token 前端代码 后端

前端->思路： 编辑地址 和 新增地址使用的是同一个vue组件页面， 发送编辑地址请求，编辑成功后 跳转到 我的地址页面 前端完整代码：编辑地址 后端思路 1.获取前端传递过来的参数：token 获取

前端思路： 前端代码 后端思路： 后端代码 页面详情地址管理 ：我的地址地址管理 ：我的地址地址管理 ：我的地址地址管理 ：我的地址

前端->思路： 采用vant插件 的地址编辑模块 + 省市区模块 注意： 1.1 地址编辑模块 data是不包含 省市区数据的，默认为空数组，要自己去 省市区模块 那里复制数据过来 1.2 data中

思路： 这个vant 计步器的加减 ，有一个事件：当绑定值变化时触发的事件，change 前端 后端接口：先根据前端传过来的id, 这里注意一点，多个function里的内容不要写相同的名字，否则容易

购物车（单个删除 和 批量删除）vuex （filter indexOf， findIndex splice，） 有点懵逼 特别是 组合在一起用的时候

思路： 前端： 将后端返回的数组 通过循环，将数组的每个对象 都添加一个属性 checked 默认为 true 前端渲染的时候，就可以直接把 第一步添加的 checked属性 动态绑定到 对应的选项标

思路 前端： 1.购物车页面一进来要要发送一个请求获取列表数据，传递token过去 将后端返回的数据保存到vuex中，这里新建了一个单独的 购物车的vuex 为：cartlist.js文件 后端 写一

思路 前端 点击添加购物车数据，发送带token 和 商品id 的请求， 后端 写一个接口，并接收后端传递过来的 商品id 和 token，其中token要进行解析 根据前端传递过来的token解析后

思路： jsonwebtoken：https://www.npmjs.com/package/jsonwebtoken 进入后端服务 执行安装： npm install jsonwebtoken 引入