zoukankan      html  css  js  c++  java
  • 记vue nextTick用到的地方

    nextTick是vue提供的全局函数,在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法,获取更新后的 DOM。

    // 修改数据
    vm.msg = 'Hello'
    // DOM 还没有更新
    Vue.nextTick(function () {
      // DOM 更新了
    })
    
    // 作为一个 Promise 使用 (2.1.0 起新增,详见接下来的提示)
    Vue.nextTick()
      .then(function () {
        // DOM 更新了
      })
    

    在实际的vue+element项目中与echart,antv G6等图形库结合使用的时候,在以下情况可能出现异常

    1. 使用element 的dialog,并且把echart图标放置在dialog中,第一次打开dialog时,echart图形没渲染,再次打开才会渲染
    2. 将G6作为一个组件,并且在watch钩子函数中监视图表数据的变动时,watch会报找不到attribute,其实就是dom还没渲染好

    以上问题都可以通过nextTick解决,完毕。
    加几个写的不错的链接

  • 相关阅读:
    nm applet disable
    profile和bash
    gre tunnel
    Redux
    react 组件架构
    Flux reference
    Controller View 模式
    Flux
    react事件代理
    虚拟dom和diff算法
  • 原文地址:https://www.cnblogs.com/linyihai/p/10806881.html
Copyright © 2011-2022 走看看