Javascript appendChild元素不立即可用

我正在使用Vue.js为Discus评论创建一个组件。discus插件只需要一个id为

discus\u thread

的元素就可以运行。我的Vue指令如下所示：

Vue.elementDirective('v-disqus',{
    params:['disqusUrl','disqusId','disqusTitle','disqusCategory'],
    bind(){
      var dc = document.createElement('div');
      dc.setAttribute('id','disqus_thread');
      this.el.appendChild(dc)
      setTimeout(() => {
        updateComments(this.params)
      },0)
    }
  });

updateComments（）

函数（为简单起见进行了编辑）：

您将看到，在调用

updateComments（）

之前，我有一个

setTimeout

。当我将其设置为0时，控制台有时会记录

未定义的
（'discus_thread'）[0]
。当我将它设置为150左右时，它几乎总是足够长，以至于插件可以正常加载

所以问题是，为什么
this.el.appendChild
不会立即启动，在调用
updateComments（）
之前，我必须做些什么来确保元素在那里

编辑：这也是
v-if
的内部，但是我假设这个元素指令在它变为真之前不会编译
 
appendChild
不是异步的。也许
this.el
还不在DOM中。谢谢Barmar，我想知道这是否与显示和隐藏内容的过渡效果有关。目前，我每200毫秒轮询一次DOM，以便在继续之前查找div，这似乎是可行的。如果转换通过添加和删除元素而不是隐藏和显示来工作，则可能是可行的。
appendChild
不是异步的。也许
this.el
还不在DOM中。谢谢Barmar，我想知道这是否与显示和隐藏内容的过渡效果有关。目前，我每200毫秒轮询一次DOM，以便在继续之前查找div，这似乎是可行的。如果转换通过添加和删除元素而不是隐藏和显示来工作，则可能是可行的。
var updateComments = function(params){
  console.log('disqus thread:')
  console.log($('#disqus_thread')[0])
  ...