computed可以监听v-model(data)中的值,只要值发生变化 他就会重新去计算
computed必须是要有一个返回值的哦
computed 属性的结果会被缓存,除非依赖的响应式属性变化才会重新计算。主要当作属性来使用;
<div id="app"> <input type="text" v-model="firstname">+ <input type="text" v-model="lasttname">= <input type="text" v-model="fullname"> </div>
var vm = new Vue({ el: "#app", data: { firstname: "", lasttname: "", }, methods: { }, // computed可以监听v-model(data)中的值,只要值发生变化 他就会重新去计算 // computed必须是要有一个返回值的哦 computed: { fullname: function () { return this.firstname + "-" + this.lasttname } }, })
//watch除了可以监听data中值的变化,还可以监听路由的变化,
//watch中有两个参数 分别是新值和旧值
var vm = new Vue({ el: "#app", data: { }, methods: { }, router: router, watch: { "$route.path":function(newval,oldval){ if(newval==="/login"){ console.log("这是denglu页面") }else if(newval==="/zhuce"){ console.log("这是注册页面") } } }, })
computed和watch的区别
《1》计算属性computed 必须要返回一个值哦 通过return来返回的
会缓存,只要数据不发生变化,就使用缓存的数据
《2》 watch的回调函数里面有两个参数,分别是newval和oldval。
不会缓存 只要数据发生变化 就会重新的去计算