vue3监听与计算

Ⅰsetup(){}函数下监听和计算

<templete>
  <div>
    {{sum}}
  </div>
</templete>
<script>
  import { watch, computed, ref } from 'vue'
  export default {
    setup() {
      const num = ref(2)
      watch(num, (newValue, oldValue) => {
        console.log(newValue, oldValue)
      })
      const a = ref(3)
      const b = ref(4)
      let sum=computed(() => {
        return a.value + b.value
      })
      return {
        sum
      }
    }
  }
</script>

Ⅱ在script标签上的setup

<script setup>
  import { watchEffect } from 'vue'
  const a = ref(3)
  const b = ref(4)
  watchEffect(() => {
    console.log(a, b)
  })
  // 只监听ref 和 reactive 且出现在回调函数中的对象
</script>