ref和reactive, toRefs的使用
看尤雨溪说：为什么Vue3 中应该使用 Ref 而不是 Reactive？
toRefs
import { ref, toRefs } from 'vue';
// 定义一个响应式对象
const state = ref({
count: 0,
name: 'Vue'
});
// 使用toRefs转换为响应式引用对象
const reactiveState = toRefs(state);
// 现在你可以对reactiveState进行解构赋值并保持响应性
const { count, name } = reactiveState;
// 当你改变count或name的值时，state的值也会相应改变
count.value++; // 相当于state.count++
name.value = 'Vue3'; // 相当于state.name = 'Vue3'