vue父组件异步请求成功后传值给子组件,子组件如何监听到

Question

父组件
<infcom :infdata="infDW"></infcom>

computed: {
infDW() {

 return this.infData

}
}

methods: {
getIData() {

接口请求  1分钟返回成功
if(res.code == '200'){
   this.infData = res.data
   console.log(this.infData)
}

}
}
mounted() {
this.getIDate()
}

子组件
watch: {
infdata(){

 console.log(this.indata)

}
// 或者
infdata:{

 deep:true,
 handler(n,o) {
  console.log(n.0)
 }
 console.log(this.indata)

}
}

父组件接口请求成功可以打印出数据
子组件的watch就没有执行
请问一下有哪里写错了吗?

Answer 1

首先，props可以做成动态的。
想要做边际影响，可以设置props的watch来获知变动。

Answer 2

你的infData 应该是个对象吧
props:{
infoData:{
type:Object,
default:function(){

  return {}

}
}
},
watch: {
infoData:{
handler(n,o){

console.log(n)
},deep:true}
}
第2种方法：自定义事件
let bus=new Vue({})
在父组件的getData方法请求成功后
bus.$emit('eventName',data)
子组件里监听该事件
crated（）{
bus.$on('eventName',data=>{console.log(data)})
}

Answer 3

父组件data中定义infData: [],
子组件使用深度监听
watch: {
infdata: {

handle() {},
deep: true,

},
}，