vue中computer和watch的区别watch中的函数是不需要调用的，computed内部的函数调用的时候不需要加括号Watch是属性监听，监听属性的变化；computed是计算属性，通过属性计算而得来的属性。

watch需要在数据变化时执行异步或开销较大的操作时使用比如你在一个方法中触发了这个计算属性，给它赋值，那么就会触发set里面的方法；然后watch监听的是你定义的变量，当你定义的变量的值发生变化时，调用对应的方法。

区别： computed中不支持异步操作，而watch中是支持异步操作 watch 监听的是已经在 data 中定义的变量，当该变量变化时，会触发 watch 中的方法watch：watch用来监听当一个数据属性值发生变化时，就可以调用的函数，没有必须依赖的数据属性；属于异步操作；Vue 实例将会在实例化时调用 $watch()，遍历 watch 对象的每一个属性。

侦听属性watch：不支持缓存，当数据变化时，会直接触发对应的操作watch支持异步 监听函数接收两个参数，第一个新值，第二个旧值计算属性默认只有 getter，不过在需要时你也可以提供一个 setter。

watch选项是一个对象，键是data里面的数据，值是对应的回调函数，回调函数有两个参数分别为修改后的值newValue和修改前的值oldValue...method,watch,computed,生命周期,教你快速上手-02

1、）beforeCreate 此时实例上只有一些生命周期函数和默认的事件，此时data computed watch methods上的方法和数据均不能访问2）created 此时可以读取data的值，并可以对其进行操作，把方法、计算属性也都挂载到了实例。

2、watch呢？它用于观察Vue实例上的数据变动对应一个对象，键是观察表达式，值是对应回调值也可以是方法名，或者是对象，包含选项3、methods是个方法，比如你点击事件要执行一个方法，这时候就用methods，computed是计算属性，实时响应的，比如你要根据data里一个值随时变化做出一些处理，就用computed。

4、V3 中在 for 循环元素上绑定 ref 将不再自动创建 $ref 数组。

vue.js中,什么时候用methods?什么时候用computed?什么时候用watch...所以他们的执行顺序为：默认加载的时候先computed再watch，不执行methods；等触发某一事件后，则是：先methods再watch。

下面的例子可以做为说明Vue.js构造函数的选项对象中，最基本的选项包括：el：指定Vue实例控制的HTML元素的选择器data：指定Vue实例使用的数据对象methods：指定Vue实例的方法computed：指定Vue实例的计算属性。

watch：指定Vue实例的监听器computed用于处理复杂的逻辑运算，主要和methods储存方法来进行区分；methods储存方法，computed储存需要处理的数据值；methods每次都会调用，computed有缓存机制，只有改变时才执行，性能更佳。

Vue.js在模板表达式中限制了，绑定表达式最多只能有一条表达式，但某些数据需要一条以上的表达式运算实现，此时就可以将此数据放在计算属性（computed）当中Vuejs中关于computed、methods、watch的区别。

在页面中使用大量或是复杂的表达式去处理数据，对页面的维护会有很大的影响vue之watch和计算属性computed计算属性computed在使用时，一定要注意，函数里面的变量都会被监听，只要里面的某一个值变动，便会将整个函数执行一遍。

如果computed属性属性值是函数，那么默认会走get方法；函数的返回值就是属性的属性值；在computed中的，属性都有一个get和一个set方法，当数据变化时，调用set方法computed属性值默认会走缓存，计算属性是基于他们的响应式依赖进行缓存的，也就是基于data中声明过或者父组件传递的props中的数据通过计算得到的值。

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。