vue3的基础入门03
const vm = Vue.createApp({
data(){
return {
msg:'tom',//基本数据类型，存放在栈内存中
user:{//引用数据类型，存放在堆内存中
id:'0001',
username:'admin',
password:'0123'
}
}
},
watch:{//方式一：通过watch选项
msg:function(new_value,old_value){
console.log('原值为：',old_value,'新值：',new_value)
},
user:{
handler:function(new_value){ console.log('user被修改：',new_value)},//监控方法
deep:true,//开启深度监视，当对象中的属性发生变化时，也会被监视
immediate:true//立即触发
},
'':{//只监视对象中的属性
handler:function(new_value){ console.log('user被修改：',new_value)},//监控方法
deep:true,//开启深度监视，当对象中的属性发生变化时，也会被监视
immediate:true//立即触发
}
},
}).mount('#app')
//方式二：
let unwathc = vm.$watch('user',function(new_value){
console.log('user被修改：',new_value)
if(new_value.username == 'abc'){
console.log('取消监视');
unwathc();//取消监视
}
},{
deep:true,
immediate:true
})//监视对象