使用Echarts报错

<template>
<div ref="wordcloudchart"style="width:400px;height:400px"></div>
</template>
<script>
export default{
    data(){
        <!--
        ...
         -->
    },
    mounted(){
        this.initWordCloudChart();
    },
    methods:{
        initWordCloudChart(){
            let wordcloud=this.$echarts.init(this.$refs.wordcloudchart);
            //console.log(wordcloud);
            <!--
            ...
           
        }
    }    
}
</script>

当前代码即完成在页面上实现词云图的功能，一切正常。但往<template>中增加了上百行代码后，wordcloud为undefined，即获取不到DOM。尝试网上的什么异步方法，jq......均不行。更改mounted为updated生效。

由于DOM中的某个DOM采用了v-if、v-show 或者 v-for（即根据获取到的后台数据来动态操作 DOM，即响应式），则DOM无法在mounted阶段获取到。mounted为加载阶段，而updated阶段则是完成了数据更新到DOM的阶段，使用this.$refs.wordcloudchart就能找到DOM。

参考链接：

https://www.cnblogs.com/menxiaojin/p/14236647.html