VUE3-watch侦听ref包裹对象

VUE3-watch侦听ref包裹对象

回顾响应式

• ref(100) ===> RefImpl对象，引用对象（使用object.defineProperty实现）。可以监视这个引用对象。
• reactive ===> Proxy对象，代理对象（使用Proxy实现），可以监视这个代理对象。
• ref({}) ===> RefImpl对象，引用对象（使用object.defineProperty + Proxy），可以监视代理对象和引用对象

关键点

watch侦听是侦听响应式对象，即RefImpl对象、Proxy对象，如果不为响应式则需要使用函数形式

代码

<template>
  <div>计数器：{
  
  {counterRefImpl}}</div>
  <button @click="counterRefImpl++">点我加1</button>
  <div>计数器2：{
  
  {data.a.b.c.counter}}</div>
  <button @click=