持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第28天，点击查看活动详情juejin.cn/post/714765…
计算属性
- computed（）方法返回值是个计算属性ref对象，在模板中使用也是会自动解包的。
- 它的参数是一个回调函数，return 组件中想要的数据。
- 需要在哪里写computed就在哪里写，没有规定地方。也就是可以写多个computed()方法。
- 也可以直接定义一个函数，不过定义为函数的话，即使结果没有改变，我们自定义的函数也会指向，不会缓存。computed()方法是会缓存的
其实直接创建函数的话，return的结果也是和computed是一样的。只不过它不会进行缓存。
侦听属性
- watch()的第一个参数可以是不同形式的“数据源”：它可以是一个 ref (包括计算属性)、一个响应式对象、一个 getter 函数、或多个数据源组成的数组。
- watch()第二个参数是个回调函数，该回调接收第一个参数是更新后的值newValue，第二个参数是更新之前的值oldvalue。
- 直接给
watch()传入一个响应式对象，会隐式地创建一个深层侦听器——该回调函数在所有嵌套的变更时都会被触发。
注意：
我们不能直接侦听响应式对象的属性值。
例如：
const obj = reactive({ count: 0 })
// 错误，因为 watch() 得到的参数是一个 number
watch(obj.count, (count) => { console.log(`count is: ${count}`) })
如果监听的是响应式对象的话，默认是深层监听。选项式中是浅监听选项中需要加deep属性，值为true。
想要立即执行一次侦听回调，那么就用watchEffect()函数
如何在watch里访问最新的DOM？
如果想在watch里访问最新的DOM，需要在watch（）里添加一个新参数，就是对象，{ flush：‘post’ }，如果是在watch（）就作为第三个参数，如果在watchEffect（）中作为第二个参数。
watch和watchEffect的区别：
watch第一个参数是谁，就只会监听谁，即使它里面涉及到了其他响应式数据，也不会监听。 watchEffect中设计了哪些响应式数据，只要某一个发生变化，就会执行里面的函数，缺点是响应式依赖不是很明确，也就是不知道监听的具体是谁。
