<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="vue.js"></script> <link rel="stylesheet" href="https://cdn.jsdelivr. ...
转载
2021-08-24 00:56:00
58阅读
2评论
https://gitee.com/eric167/vue
原创
2021-07-31 15:57:36
264阅读
computed:{ lists(){ return this.$store.state.list },},用v-model来双向绑定input控制checkbox是否选中Vue中双向数据绑定是如何实现的position的取值static、relative、absolute、fixed、inherit、stickystatic标准文档流r...
原创
2021-07-16 10:21:02
166阅读
代码下载地址：https://github.com/MengFangui/VueShoppingCart 1、index.html 2、index.js 3、style.css 4、效果
转载
2017-12-18 10:31:00
134阅读
2评论
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi ...
转载
2021-09-19 21:26:00
278阅读
2评论
前言本实例主要介绍利用Vue实现购物车组件，顶部可以切换标签“全部”、“好评”和“买过”的数据，标签“全部”下还可以切换不同分类显示商品；也可对商品进行加减，并进行跨标签和跨分类的最终价合计；最终效果： 实现过程一. 子组件代码如下（shoppingCart.vue），原理分析：1. 切换标签函数toggleType，点击时，赋值this.currentIndex = index，同时利
转载
2024-03-26 17:10:28
173阅读
安装此包，然后再vue项目的全局根目录中新建db文件夹，其中新建index.json文件。此项目需要用到json-server，模拟后台服务器接口
原创
2023-09-16 17:40:16
131阅读
最终效果HTML部分：<!doctype html><html lang="en"><head> <meta cha
原创
2023-01-03 15:02:01
123阅读
写在博客前的话： 保留两位小数使用的是 .toFixed(2) 方法 动态绑定v-bind:disabled='item.count <=1 '来判断按钮是否可点击 按钮的动态使用index去判定 思路： 表格的建立，表头，循环遍历js中的数组 实现过滤器添加￥与实现小数点后两位 实现加减按钮的点击 ...
转载
2021-10-13 10:58:00
113阅读
2评论
功能介绍
金额 = 单价 * 数量金额会自动根据数量的变化进行变化，我们可以点击按钮增加或减少商品的数量。合计金额：只有在序号列号勾选上才会被计入总金额中，金额总数会根据用户的操作自动更新数据。删除：如图我们勾选了第2个商品，当我们点击删除时，只会删除被选中的产品，点击删除时有提示。全选：点击1次全选会选中所有商品，第2次点击时就会取消已经选中的商品。添加：用户可以自己添加商品、商品的单价、数量搜
原创
2023-05-29 09:37:47
90阅读
购物车案例 经过一系列的学习，我们这里来练习一个购物车的案例 **需求：**使用vue写一个表单页面，页面上有购买的数量，点击按钮+或者-，可以增加或减少购物车的数量，数量最少不得少于0，点击移除按钮，会移除该商品，当把所有的商品移除后，页面上的表单消失，然后出现文字：购物车为空，表单下方是商品的总
原创
2021-07-02 09:47:38
534阅读
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <script src="js/vue.js" type="text/javascript" charset="utf-8"></script> <style ...
转载
2021-09-23 20:31:00
342阅读
2评论
一、在商城系统中，购物车结算是必备的一个环节。以下代码（参考17素材网）用于模拟购物车商品结算，仅供参考。二、项目目录介绍1、products.json 用于模拟接口；2、vue-resource.js 用于数据请求3、shoppingCart.js 用于购物车商品结算操作三、代码及分析index.html<!DOCTYPE html><html> <head&...
转载
2021-08-27 12:50:00
955阅读
点赞
一、在商城系统中，购物车结算是必备的一个环节。以下代码（17素材网）用于模拟购物车商品结算
转载
2022-02-21 17:46:10
265阅读
作者 | hai_27前言上学期利用课余时间学习了Vue.js，Node.js，一直想做个完整的项目实践一下，但之前在学校并没有那么多的时间。现在恰好有时间，就想着做一个项目巩固之前学到的东西。思来想去，最后决定模仿小米商城做一个电商项目，目前已经差不多做完了，此处就购物车模块的实现进行总结。效果话不多说，先看效果。实现步骤1、静态页面准备页面使用了元件的UI的Icon 图标， ，el-check
转载
2024-08-02 12:54:21
64阅读
vue提供了<transition></transition>和<transition-group></transition-group>实现元素状态的过渡.加入过渡效果可以使元素的展示和隐藏更自然.如果在vue中使用了<transition></transition>标签,vue会检测是否有应用CSS过渡动画或JavaScr
转载
2024-04-30 18:53:17
361阅读
