序
在实例vue对象时候，可以选择使用computed来完成计算,mvvm是mode，view，viewmode实现数据的双向绑定，这也体现其的便捷性。
示例代码
点击查看代码
<div id="app"> <input type="text" v-model="bookNum" /> <br /> <input type="text" v-model="price" /> <br /> {{bookNum}}本书，单价{{price}}， <br /> <button @click="bookNum++">加量</button> <button @click="price++">加价</button> <br> 一共要：{{getAllprice}}元 </div><script> var vm = new Vue({ el:"#app", data:{ bookNum:1, price:35, }, methods:{ count:function(){ this.countMoney=this.price*this.bookNum; } }, computed:{ getAllprice:function(){ return this.price*this.bookNum } }, }) </script>
界面效果
知识点
- v-mode 例子：input type="text" v-model="price" 数据绑定，可以实时修改
- computed 专门用于计算
- v-on：click 调用函数