vue3数据响应式生效的时机

1、
视图更新和数据更新

let a = ref(0) //a.value = 0
let b = 0 // b = 0, a.value = 0 
b++ // b = 1, a.value = 0
a.value++ // b = 1, a.value = 1

在上述过程中，a.value和b的值都会变化，但只有a是响应式的，a.value++时视图会更新，并且仅仅更新自己相关的引用。
ref()创建了一个响应式引用，在任何地方起作用，在整个应用中都不会失去它的响应性。
2、
组件间的响应式

// 父组件数据定义
let a = ref(0) 

// 子组件
<template>
{{a}} {{b}}
</template>

<script setup>
const props = defineProps({a:Number})
const b = 0
watch(()=>props.a,()=>{b=props.a+1})
</script> 

当传入的props.a变化时，视图中的引用的a也会更新，这是“a的响应式在任何地方都起作用”。
在监听函数中，b会随着a的变化而变化，但视图中的b并不会更新，因为b是非响应式的。