vue中的计算属性

计算属性的需求原因

  • 把过多的逻辑写在模板中,难以维护,这一点的用methods也可以解决,就是有无函数调用的区别,一个有括号一个没括号,但是不止于此因为:
  • 计算属性执行一次后就会把计算过的data中的数据存储在缓存中,而使用methods方法会一直调用,当方法极其复杂的时候计算属性的优势就会凸显
  • 只要依赖改变,计算属性的结果也会跟着改变
实现模糊查询的功能
  • {{data}}

这个getMydatalist就是计算属性,所以计算属性是可以当作data中的数据使用的。
getMydatalist(){ return this.datalist2.filter(item=>item.indexOf(this.mytext3)>-1) }

【vue中的计算属性】这样子的写法形成了模糊查询的结果跟mytext3的依赖,只要mytext3变化,计算属性就会形成一个新的可供循环的列表,说到底就是计算属性可以把一个函数的返回值当成一个data里面的数据来用。
计算属性就是加工现有的数据,如果这个数据模板中用的到,然后可以放到模板中去渲染,且可以是动态变化的,依赖data中的数据变化而变化

    推荐阅读