vue3 之 组合式API—computed

computed计算属性函数

计算属性基本思想和Vue2的完全一致，组合式API下的计算属性只是修改了写法

核心步骤：

1. 导入computed函数
2. 执行函数 在回调参数中return基于响应式数据做计算的值，用变量接收

```vue
<script setup>
// 1.导入computed
import {ref, computed } from 'vue'
// 原始数据
const list = ref([1,2,3,4,5,6,7,8])
// 2.执行函数return计算之后的值 变量接收
const computedList = computed(()=>{
   return list.value.filter(item=>item>2)
})

setTimeout(()=>{
  list.value.push(9,10)
},3000)

</script>
<template>
  <div>
     原始响应式数组 —— {{list}}
  </div>
   <div>
     计算属性数组 —— {{computedList}}
   </div>
</template>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

1