compute 和 methods 区别和应用场景

431 阅读2分钟

人生最害怕的就是面试,偏偏记性还不好,被有些问题问到的时候总是熟悉却又开不了口,这种尴尬演变到越来越惧怕面试,此处当做回忆的一个小角落吧,记录下自己容易混淆的一些概念。

最近做项目用到computed和methods,反复看了官方文档的介绍还是大大的问号,直到看到一篇解释,又返回去看了下文档,感觉思绪顺畅了很多。转自blog.csdn.net/MCQq123321/…

computed vs methods

比如,我们要在页面上显示A+B的值,

methods方法:reuturn A+B

computed计算属性:return A+B

这样看起来两个是没有区别的,都是可以返回结果,而且当A或者B变化时候都是可以返回正确的结果,这个是没问题的,

但是,如果页面还有一个变量C呢,这个C变化时候页面会重新渲染,这个时候两个就有区别了:methods回去重新执行方法,而computed会读取上一次的缓存,如果有一个很复杂的计算,那对性能就有了无谓的消耗,所以就是为什么在页面上显示多个计算出来的值得时候用了computed计算属性,而不用methods方法

computed vs watch 两者都是可以监听变化、

比如有个需求同样是返回A+B,

computed的写法是return A+B;

watch的写法是:分两步,要监听A,也要监听B

A(){return this.A+this.B},

B(){return this.A+this.B},

这样写法上就有区别了,所以按这个需求我们可以理解下 计算属性就是要返回处理数据的一个监听集合(要监听多个)

当然,两者还有本质上的区别:比如有个需求:A变化时候B的值变为1,这个就只能是使用监听来处理了,不能使用计算属性