方案一:
在子组件中设置v-if=’flag’,初始值false,在成功获取数据后设置为true
// 子组件
<echarts :datas="conditionStatisticsData" v-if="flag"></echarts>
// 成功获取数据后 flag设置成true
homeResource.getConditionData().then((res) => {
this.flag = true
if (res.data.status === 0) {
console.log('条件', res.data.data)
this.conditionStatisticsData = res.data.data
}
})
方案二:
watch监听props传递过来的值,在里边执行方法
watch: {
datas: function (val) {
this.chartsInit(val)
}
},

本文介绍了两种Vue子组件数据加载的方法。方案一通过v-if指令结合数据获取状态控制组件渲染,确保数据加载后再显示。方案二是利用watch监听外部传入的数据,动态执行图表初始化等操作。
9918





