vue_4-listener

listener

1. Description

We can use watchthe option to trigger a function every time a reactive property changes

Reactive: the data declared in data

2. Code demonstration

<template>
    <p>{
   
   {msg}}</p>
</template>

<script>
export default {
      
      
    data(){
      
      
        return{
      
      
            msg:"Hello"
        }
    },
    //侦听器
    watch:{
      
      
        //方法名必须于属性名对应
        //数据发生变化自动执行的函数
        msg(newValue,oldValue){
      
      
            console.log(newValue,oldValue);
        }
    }
}
</script>

3. Effect display

Output World Hello
W6l4-1702291379628)]

Output World Hello