vue父组件向子组件传递异步加载的数据不显示解决方案

1、父组件

<wxChat 
            :data="wxChatData"
            :showShade="false"
            :contactNickname= doctor.doctorName           
            :ownerAvatarUrl="ownerAvatarUrl"
            :contactAvatarUrl="contactAvatarUrl"
            :width="width">
        </wxChat>

2、子组件接收data

props: {
    data: {
       type: Array,
       required: true
    }
},

3、子组件渲染数据

<ul>
    <li v-for="(message, index) in dataArray" :key="index" >
         .....            
    </li>
</ul>

解决方案：监听父组件传来的数据，动态改变子组件中使用的变量

watch: {
     data: function(val) {
         console.log('val监听:',val)
         this.dataArray = this.dataArray.concat(this.data);
     }
}