对于任何复杂逻辑,你都应当使用计算属性
类似于过滤器,对绑定到view的数据进行处理
如上例,在Vue实例化的时候,computed定义computedTest方法会做一次计算,返回一个值,在随后的代码编写中,只要computedTest方法依赖的message数据不发生改变,computedTest方法是不会重新计算的
如果我们碰到一个场景,需要1000个computedTest的返回值,那么毫无疑问,这相对于methods而言,将大大地节约内存
哪怕你改变了message的值,computedTest也只会计算一次而已
computed和 methods区别
methods: 函数没有缓存,每次都会被调用
computed: 计算属性有缓存,只有数值改变之后才会被调用;有get和set函数(双向绑定)
总得分(函数-单向绑定):
总得分(计算属性-单向绑定):
computed 的get 和set
当你读取一个变量的时候会触发该变量的getter.当你修改该变量时候会触发他的setter.
//set函数是当数据发生变化时调用.监听到 “姓”的变化,执行set 函数
// get 函数,返回绑定的“姓” 的输入框的value 值