VUE之购物车

我写了个简单的购物车如下！

首先是商品列表：

这个数据先是假数据，以后再改正

好， 商品列表就写完了， 商品类，就三个属性！

我们重点看，添加到购物车的逻辑！ addItem() 方法

当我们得到购物车的数据的时候，我们就开始将数组真正传递给购物车了！

一个传递，另外我们购物车组件就得接收！

Cart.vue

这个Cart.vue 中，我用到了，计算属性（计算总价格）

还用到了，如果得到元素在数组中的下标

还用到了，双向数据绑定！

我这个绑定就是绑定的 是否选中这个逻辑，我绑定到了，购物车中，商品的一个字段！

至于v-for 遍历时，key 的绑定我选择了，商品的id

行，上面还缺，一个商品类表那个组件的代码！

HelloWorld.vue

整体，就是 HelloWorld.vue 里面使用 Cart.vue

gif动图我就不做了，以后我会下个工具做个动图：