Vue3 watch 监听基本数据类型、数组、对象(属性)、Props、多个数据的写法

1、监听基本数据类型

watch(str, (newValue, oldValue)=>{

  console.log(newValue)

  console.log(oldValue)

})

2、监听数组

watch(arr, (newValue, oldValue)=>{

  console.log(newValue)

  console.log(oldValue)

})

 3、监听对象

watch(obj, (newValue, oldValue)=>{

  console.log(newValue)

  console.log(oldValue)

})

 4、监听对象属性

watch(() => obj.name, (newValue, oldValue)=>{

  console.log(newValue)

  console.log(oldValue)

})

5、监听props

watch(() => props.name, (newValue, oldValue)=>{

  console.log(newValue)

  console.log(oldValue)

})

6、监听多个数据(基本数据类型 + 对象属性)

watch([str, () => obj.name], (newValue, oldValue)=>{

  console.log(newValue)

  console.log(oldValue)

})

7、监听多个数据(基本数据类型 + 数组)

watch([str, obj], (newValue, oldValue)=>{

  console.log(newValue)

  console.log(oldValue)

})

你可能感兴趣的:(Vue3,前端,vue.js,javascript)