this.$nextTick()简单使用

该方法是当vue单例数据被赋值时,视图并不会立即更新,等到真正DOM更新时,vue单例会执行该函数。
Vue.nextTick(function() {...})用于操作真实DOM的场景,会在真实DOM更新后,执行该函数,这会保证开发者拿到的真实DOM永远是最新的。

这常用于需要使用ref,或是需要计算DOM元素的相关属性时使用

// 如在created中
created(){
  // 异步获取数据
  this.data1 = 1;
  // 此时视图没有真正更新,不能访问ref
  this.$nextTick(function(){
    // 对真实DOM进行操作
    this.$refs.myDom.innerHtml = "xxxx"
  })
}

你可能感兴趣的:(this.$nextTick()简单使用)