欢迎来到福编程网,本站提供各种互联网专业知识!

基于Vuejs实现购物车功能

发布时间:2016-08-02 作者:前端小菜bi 来源:转载
这篇文章主要为大家详细介绍了基于Vuejs实现购物车功能的相关资料,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

本文实例为大家分享了Vuejs购物车实现代码,供大家参考,具体内容如下

html:




 
 我的vue购物车
 
 
 
 


 

css:

h3{
 text-align: center;
}
.left{
 margin-left: 14%;
}
.item{
 text-align: center;
 padding: 3%;
}
.add{
 margin-left: 15%;
}
.off{
 background-color: lightgrey;
 border: 1px solid lightgrey;
}

js:

/**
 * Created by Administrator on 2016/7/29.
 */
var data = [
 {
  name:'IPhone 6',
  price:5466,
  id:1,
  count:1
 },
 {
  name:'IMac',
  price:7466,
  id:2,
  count:1
 },
 {
  name:'iPad',
  price:5400,
  id:3,
  count:1
 }
]

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持全福编程网。

相关推荐