vue3中的watchEffect

<template>

    <div>

    <h1>{{p1}}</h1>

    <br>

    <h1>{{p2}}</h1>

    <br>

    <h1>监听一个对象数据变化:{{p3.age.num}}</h1>

    <br>

    <button @click="p1++">点击P1++</button>

    <button @click="p2+=2">点击P2+=2</button>

    <button @click="p3.age.num++">点击年龄++</button>

   

    </div>

    </template>

   

    <script>

    import{ref,watchEffect,reactive}from 'vue'

   

    export default ({

        setup(){

            const p1=ref(0)

            const p2=ref(1)

            const p3=reactive({

                name:'马云',

                age:{

                    num:1

                }

   

            })

           const res=watchEffect(()=>{

            const a =p1.value

            const b =p3.age.num

           })

         res()

         //停止监听  

            return{p1,p2,p3}

        },

    })

    </script>