vue中计算属性和watch的区别

学习vue框架,一定少不了学习计算属性computed和watch

computed计算属性是用来声明式的描述一个值依赖了其它的值。当你在模板里把数据绑定到一个计算属性上时,Vue 会在其依赖的任何值导致该计算属性改变时更新 DOM。这个功能非常强大,它可以让你的代码更加声明式、数据驱动并且易于维护。

watch监听的是你定义的变量,当你定义的变量的值发生变化时,调用对应的方法。

 

<div>{{Name}}</div>
data(){
return {
num:0,
lastname:'',
firstname:'',
}
}
//当num的值发生变化时,就会调用num的方法,方法里面的形参对应的是num的新值和旧值
watch:{
num:function(val,oldval){
    console.log(val,oldval);
}
},
//计算属性computed,计算的是Name依赖的值,它不能计算在data中已经定义过的变量。
computed:{
    Name:function(){
        return this.firstname+this.lastname;
    }
}

 

转载:vue计算属性和watch的区别是什么?

Logo

前往低代码交流专区

更多推荐