使用this.$nextTick()获取不到数据更新后的this.$refs.xxx.

今天遇到了这样一个场景，在数据更新之后，使用this.$nextTick(()=>{console.log(this.$refs.xxx)}) 获取不到改dom，但是用setTimeout能够获取到，在此记录一下。

先看代码

  
<!--这是模板代码，父级用的v-else-if，与父级同级的还有两个盒子，分别用v-if和v-else控制着-->
<div ref="articleContent" class="right" v-html="articles.content"></div>



//这是script代码

 mounted() {
    
        this.getArticlesDetail()
    
  },
  methods: {
   async getArticlesDetail(){
        try {
            
            const {data}= await getArticlesDetail(this.articleId);
            /* vue数据更新是异步的 ,在这一步数据加载出来，但是组件还没没有渲染出来，因为在组件中有个v-if判断，在数据加载出来之后，才能渲染出来组件*/
            /* console.log(this.$refs.articleContent) */
            /* 所以要放在定时器是异步执行，试了用this.$nextTick，不行 */
          /*  */
            this.articles = data
            /* 只能用setitmeout是因为数据在在下个Event L