【bug记录】vue中如何解决watch监听数据后props根据v-if动态判断并挂载DOM的问题

    问题如图

问题复现：父组件中通过名为 seriesData的 prop 向子组件 LineChart 传入数据

 父组件：

接口返回的数据：enterpriseData

接口数据处理过的数据：LineData

<LineChart
   :title="'xxxx统计'"
   :series-data="LineData"  
   :enterprise-data="enterpriseData"
   @setRegionCode="handleRegionCode" 
   @resetLineData="resetLineData"
   />

子组件：接收 seriesData数据当存在且至少有一条数据的时候，创建 id 为 lineId 的 div，用以初始化 echarts 实例

<template>
<div v-if="enterpriseData&&enterpriseData.length > 0" :id="lineId" :style="style" />
<div v-else class="emptyDataWarp">
<emptyData />
</div>
</template>

我们需要用v-if判断空数据时，展示空页面；

既然如此我们保留 v-if 但写法有所改变：

修改 LineChart 组件：

<div v-if="enterpriseData&&enterpriseData.length > 0" style="width: 100%; height: 100%">
   <div :id="lineId" :style="style" />
</div>
<div v-else class="emptyDataWarp">
   <emptyData />
</div>