computed 和watch 区别

computed 和watch的区别:  computed 不能直接监听值  和 watch能直接监听值 !!!

1）computed依赖缓存，data不变则不会重新计算，性能优化的一种形式

2）watch 如何深度监听deep :true, 引用类型深度监听拿不到旧的值,默认是浅监听

<p>num的值：{
   {num}}</p><p>double1的值： {
   {double1}}</p>
<input type="text" v-model="double2"><input type="text" v-model="name">
<input type="text" v-model="info.city">

<script type="text/ecmascript-6">
export default {data() {return {message: '恭喜你，这是一条<b>成功</b>消息',num: 20,name: 'liu_man', info: {city: '重庆'}}},// computed默认只有get 方法,如果要双向绑定需重写set方法computed: {double1() {return this.num * 2},double2: {set() {console.log('set');return this.num * 2},get() {return this.num / 2}}},watch: {name(val,oldval) {console.log(val, oldval); // 监听值类型，可以拿到旧的值},info: {handler(val, oldval) {console.log('已触发watch info');console.log(val, oldval); // 监听引用类型，不能拿到旧的值，因为引用类型存放在堆中，指向同一个内存地址},deep: true // 深度监听}}
}
</script>

通过computed传参的情况

<template><div>{
   {amount(2.213)}}</div>
</template>
<script>
export default {data() {return {price: 1000};},computed: {amount() {return (n) => {return Number(n).toFixed(2)}}}
};
</script>