vue的计算属性
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="vue.js"></script>
</head>
<body>
<div id="app">
<p>{{price}}</p>
<p>{{price1}}</p>
</div>
</body>
<script>
var vm = new Vue({
el:'#app',
data:{
price:23.9999,
},
//计算属性,当我们要对data的属性进行调整为另一个变量，留作为其他地方进行运算使用时，可以使用计算属性得出另一个变量
computed:{
price1:function (){
return this.price.toFixed(2)
}
}
})
</script>
</html>
vue的侦听属性
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="vue.js"></script>
</head>
<body>
<div id="app">
数量： <input type="text" v-model="num">
单价： <input type="text" v-model="price">
总价： <input type="text" v-model="total">
</div>
</body>
<script>
var vm = new Vue({
el:'#app',
data:{
price:23.9,
num:1,
total:0
},
//侦听属性:当数据发生变化时执行，并告诉其他地方要做啥
watch:{
num: function (oldvalue,newvalue) {
console.log(num=newvalue) //1
console.log(num=oldvalue) //0
this.total = this.num*this.price
},
price:function () {
this.total = this.num*this.price
}
}
})
</script>
</html>
