vue-composition-api

vue-composition-api-watch.vue

<template>
  <div>
    <input type="text" v-model="search">
    <input type="text" v-model="search2">
  </div>
</template>

<script>
  import { ref, watch, watchEffect } from 'vue'
  export default {
    name: 'HelloWorld',
    setup() {

      const search = ref('');
      watch(search, (newValue, oldValue) => {
        console.log('watch search', newValue, oldValue)
      })

      const search2 = ref('');
      watch(search2, () => {
        console.log('watch search2', search2.value)
      })

      watchEffect(() => {
        console.log('watchEffect', search.value, search2.value)
      })

      return {
        search, search2
      }
    }
  }
</script>