三分钟了解vue 计算属性

含义:一个变量的值依赖一些数据计算而来的结果
特点:带缓存,当计算属性多次使用时,只要依赖项不变,其会直接读取缓存进行复用
语法1(函数):

computed:{
    计算属性名(){
        return 值
    }
}

语法2(对象):

computed: {
    计算属性名: {
      set(value) {
      //当计算属性被赋值时触发set函数,并将值作为set函数第一个参数
      },
      get() {
      //get必须要return值且只要访问计算属性就会执行get函数
        return 值
      },
    },
  }

使用:

<template>
    <div>
        {{计算属性名}}
    </div>
</template>