$nextTick 获取dom undefined

Question

<template v-for="(item,index) in comps">
  <a-tab-pane :tab="item.foName"  :key="index">
      <a-card  size="small">
          <component  :is="item.app" :ref="item.foKey"  @ok="submitOK"></component>
      </a-card>

  </a-tab-pane>
</template>

这里动态渲染组件

... http 请求
res=>{
  res.map(item=>{
      item.app = this.loadComps(item.foKey);
  })
  this.$nextTick(()=>{
      console.log(this.$refs[res[0].foKey],'----- --refs组件----')
  })
}

为啥我在$nextTick 里获取不到Dom

Answer 1

component是子组件吗？如果是的话是因为nextTick只在当前组件dom更新后触发，并不能监听到子组件渲染完成。可以在子组件mounted中加入$emit发送渲染完成信号，父组件$on接收就行了。