首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    【畅购商城】购物车模块之查看购物车

    目录 分析 接口 后端实现 前端实现:显示页面 前端实现:显示购物车信息 分析 用户如果没有登录,购物车存放在浏览器端的localStorage处,且以数组的方式进行存储。...用户如果登录了,购物车存放在redis中,以Cart对象字符串方式存储。...BaseResult.ok("查询成功", cart.getData().values()); } 前端实现:显示页面 步骤一:创建 ~/pages/flow1.vue 组件,拷贝 ~/static/flow1.html...步骤一:修改api.js 查询购物车信息 步骤二:页面加载成功后,获得购物车信息(如果登录从后端获取,如果没有登录从浏览器端获得) 步骤三:遍历显示购物车信息, 步骤四:通过计算属性,计算总价格 步骤一...:修改apiclient.js 查询购物车信息 //查询购物车 getCart : () => { return axios.get("/cart-service/carts") }

    1.2K20

    黑马瑞吉外卖之购物车功能开发(添加购物车购物车数据展示)

    黑马瑞吉外卖之购物车功能 前端界面分析 后台购物车功能逻辑实现 前端界面分析 当我们点击选择规格的时候,数据参数item会传入按钮绑定的方法中 我们点击到这个按钮的时候,那么就会绑定到这个方法...然后整个框的下面应该就是加入购物车的选择。当我们点击机器如购物车的时候就应该是一个按钮绑定方法,这个方法一定会向后端提交数据请求。那么就是走到这里的这个方法。...然乎我们定位到加入购物车的这个按钮所绑定给的方法。下面这里就是进行了一些数据的·遍历赋值,当然如果我们美誉选择口味数据的时候就点击加入购物车,这里就会提示让你请选择数据。...,因为这个购物车表中会添加很多的数据,我们需要按照片不同的用户来区分不同的用户的购物车,当然没非常重要的就是,如果用户登录到前台页面,所展示也就是他的id下面所关联到的购物车数据。...当然这个展示查询的话一定是需要我们后台给的购物车的查询接口的。

    1K20

    【畅购商城】购物车模块之修改购物车以及结算

    目录 购物车操作:修改 分析 接口 后端实现:更新 前端实现:修改 前端实现:全选 后端实现:删除数据 结算 跳转页面 购物车操作:修改 分析 接口 PUT http://localhost:10010...user * @param cartVoList */ public void updateCart(User user, List cartVoList) { //1 获得购物车..."cart" + user.getId(); String cartStr = stringRedisTemplate.opsForValue().get(key); // 处理是否有购物车...handler方法       deep: true      //深度监听,常用于对象下面属性的改变     }   }, 后端实现:删除数据 只需要修改数据即可,watch已经完成删除操作 步骤一:修改html...= null){ //登录 //location.href = "flow2.html"; this.

    99920
    领券