百度站长平台网站改版工具免费发链接的网站
计算属性
计算属性的重点突出在属性两个字上(属性是名词)，首先它是个属性其次这个属性有计算的能力(计算是动词)，这里的计算就是个函数;简单点说，它就是一个能够将计算结果缓存起来的属性(将行为转化成了静态的属性)，仅此而已;可以想象为缓存！
<div id="app"><p>currentTime1={{currentTime1()}}</p><p>currentTime2={{currentTime2}}</p>
</div><!--导入vue.js-->
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.min.js"></script>
<script>var vm = new Vue({el: "#app",data: {message:"hello,kuangshen"},methods: {currentTime1: function (){return Date.now();//返回时间戳}},computed:{ //计算属性:methods和computed 中的方法名可以重名//重名之后，只会调用methods的方法currentTime2: function (){this.message;//mybatisreturn Date.now();//返回时间戳}}})
</script>
注意：methods和computed里的东西不能重名
说明：
-
methods：定义方法， 调用方法使用currentTime1()， 需要带括号
-
computed：定义计算属性， 调用属性使用currentTime2， 不需要带括号：this.message是为了能够让currentTime2观察到数据变化而变化
-
如何在方法中的值发生了变化，则缓存就会刷新!可以在控制台使用vm.message=”q in jiang"， 改变下数据的值，再次测试观察效果!
结论：
调用方法时，每次都需要讲行计算，既然有计算过程则必定产生系统开销，那如果这个结果是不经常变化的呢?此时就可以考虑将这个结果缓存起来，采用计算属性可以很方便的做到这点，计算属性的主要特性就是为了将不经常变化的计算结果进行缓存，以节约我们的系统开销；