export default {
name:'index',
props: {
//从父组件过来的数据
test: {
type: Array,
default: () => []
}
},
data() {
return {
data: []
}
}
watch: {
//对这个数据进行监听
test: {
//默认(test是空数组)是不进行初次监听,要初次监听就immediate要设为true
immediate: true,
//如果test数组里面是多个对象,且对象中的属性发生变化,deep(是深度监听)设为true
deep: true,
handler(v) {//执行监听到的数据v(从父组件异步过来的数据)
this.data = v
console.log(v)//打印一下,你发现这里是一坨数据
}
}
}
}
好啦,身为前端小菜鸡的我,就理解了这么多
更新一下,可以对象里面的某个属性,也可以监听计算属性
data(){
return {
obj:{
name:'张三'
}
}
},
computed:{
fun(){
console.log('这里一堆代码')
}
},
watch:{
//监听对象里面的某个属性,一参是v新值,二参是old旧值
'obj.name'(v,o){
console.log('这里一堆代码')
},
//监听计算属性
fun:{
handler(v) {
console.log('这里一堆代码')
}
}
}