使用 Vuejs 制作简易的购物车

首先在页面中引入js文件：

<script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script>

整个商品界面的话使用table标签，界面源码如下

对应的生成的Html界面如下：

js脚本如下：

可以发现，使用Vuejs制作一个购物车非常的简单。在标签的属性中就可以直接操作商品的数量，这里的总价通过计算属性进行绑定（当然也可以通过方法来绑定），能够立刻就响应选中商品数量的变化。