OptionalAPI同前。本文主要通过OptionsAPI和CompositionAPI对比watch的用法，让大家快速掌握vue3中watch的新用法。建议收藏！1.watch的新用法在optionAPI中，watch使用watch:{mood(curVal,preVal){console.log('cur',curVal);//最新值console.log('pre',preVal);//修改之前的值}}1.1。watch使用语法在CompositionAPI中，使用watch时，必须先引入。使用语法为：import{watch}from"vue"watch(name,(curVal,preVal)=>{//businessprocessing},options)一共有三个参数，分别是：name：需要的属性listenedto(curVal,preVal)=>{//业务处理}箭头函数是监听到的最新值和本次修改前的值，这里进行逻辑处理。options：配置项，监听器的配置，如：是否深度监听。刚进入页面时，不会执行。当值发生变化时，会打印出当前最新值和修改前的值。示例1：监听一个数据import{ref,watch}from"vue"exportdefault{setup(){constmood=ref("")//framelistenerwatch(mood,(curVal,preVal)=>{console.log('cur',curVal);console.log('pre',preVal);},{//配置项})return{mood}}}watch也可以监控多个属性值，传入的数据变为一个数组，配置项保持不变。1.2.watch监控多个属性值示例2：监控多个属性watch([mood,target],([curMood,curTarget],[preMood,preTarget])=>{console.log('curMood',curMood);console.log('preMood',preMood);console.log('curTarget',curTarget);console.log('preTarget',preTarget);},{//配置项})1.3、watch监控引用数据类型watch监控时引用数据类型，如果只监听其中一个属性，使用语法如：watch(()=>obj.name,(curValue,preValue)=>{//frame监听引用数据类型的某个属性},{//配置项})第一个参数，回调函数返回需要监听的对象的属性。后面的参数和上面一致。示例3：框架监听对象的一个??属性
