vue3中的computed计算属性

computed又被称作计算属性，用于动态的根据某个值或某些值的变化，来产生对应的变化，computed具有缓存性，当依赖的值无变化时，不会引起computed声明值的变化 

<template>
  <div>age:{{ age }}</div>
  <div>age_computed_get:{{ age_computed_get }}</div>

  <div>age_computed_set:<input v-model="age_computed_set" /></div>
</template>

<script setup>
import { ref } from "@vue/reactivity";
import { computed } from "@vue/runtime-core";

let age = ref(1);
// 用法1。读计算属性
let age_computed_get = computed(() => age.value + 1);
// 用法2。读写计算属性
let age_computed_set = computed({
  get() {
    return age.value + 1;
  },
  set(val) {
    age.value = val;
  },
});
</script>