计算属性基本思想和 Vue2 的完全一致，组合式 API 下的计算属性只是修改了写法
核心步骤：
1. 导入 computed 函数
<script setup>
import { computed } from 'vue'
</script>
2. 执行函数 在回调参数中 return 基于响应式数据做计算的值，用变量接收
<script setup>
import { computed } from 'vue'
const computedState = computed ( () => {
return 基于响应式数据计算之后的值
})
</script>
例如：
<script setup>
import { ref } from 'vue'
import { computed } from 'vue'
const list = ref([1,2,3,4,5,6,7,8])
const computedState = computed(() => {
return list.value.filter(item => item > 2)
})
</script>
<template>
<div>{{ computedState }}</div>
</template>