计算属性 computed

次要是用在页面须要通过计算来取得另外一个值的时候利用

留神1: 计算属性和data属性都是变量-不能重名. 用法和data雷同

留神2: 函数内变量变动, 会主动从新计算结果返回
需要:计算两个数据的值
<template>
<div>

<p>和为: {{ num }}</p><p>{{ reverseMessage }}</p>

</div>
</template>

<script>
export default {
data() {

return {  a: 10,  b: 20,  message: "我是个字符串",};

},
computed: {

num() {  return this.a + this.b;},reverseMessage() {  return this.message.split("").reverse().join("");},

},
};
</script>
split("").reverse().join("")这一串是返回一个将一个字符串拆分数组,反序,再从新拼接回字符串的性能。

计算属性用于缓存

在编译过程中第一次遇到的时候失常运行,前面只有变量的数值不变,那么就间接在缓存中读取,不须要从新计算
return会把值放在缓存中,如数值变动,那么就须要从新计算了。