父子mounted生命周期顺序导致的问题解决

1.背景：将父组件实时获取的接口数据传递给子组件，子组件渲染页面

2.问题：由于父子组件的mounted生命周期顺序为子先父后，导致子组件prop拿到的数据为空

3.尝试过的方法： 在子组件的mounted增加this.$nextTick(() => {}，使之加载完成时渲染，未解决，拿到的数据仍然是空

4.解决办法1）在父组件里面，子组件挂载的地方使用v-if，父组件拿到数据之后改变v-if的值使子组件渲染，但是这样会导致子组件的mounted执行两遍，第一遍拿到的空，第二遍拿到的是有值的，所以需要额外在渲染接口那里增加判断条件，if(this.$refs.monitorSvg) {}如果子组件被加载则开始渲染页面

5.解决办法2）在父组件里面，子组件挂载用ref定位，子组件的渲染操作使用方法封装起来，当父组件拿到数据之后，使用this.$refs.M3Chart.setOption()在父组件里面调用子组件的方法, 使子组件渲染