vue $nextTick( [callback] )使用场景

vm.$nextTick( [callback] )函数的用法:将回调延迟到下次 DOM 更新循环之后执行。在修改数据之后立即使用它,然后等待 DOM 更新。

1、因此可以在created或者mounted函数中使用vm. n e x t T i c k ( [ c a l l b a c k ] ) 函 数 , 来 为 需 要 添 加 事 件 的 d o m 元 素 添 加 事 件 。 v u e 生 命 周 期 中 提 供 了 c r e a t e d , m o u n t e d 方 法 , 可 以 在 页 面 初 始 化 时 候 获 取 一 些 页 面 需 要 的 数 据 , 但 是 有 的 时 候 需 要 根 据 数 据 动 态 的 为 页 面 某 些 d o m 元 素 添 加 事 件 , 这 就 要 求 在 d o m 元 素 渲 染 完 毕 时 去 设 置 , 但 是 c r e a t e d 与 m o u n t e d 函 数 执 行 时 一 般 d o m 并 没 有 渲 染 完 毕 , 所 以 就 会 出 现 获 取 不 到 , 添 加 不 了 事 件 的 问 题 , 一 开 始 没 有 发 现 v m . nextTick( [callback] )函数,来为需要添加事件的dom元素添加事件。vue生命周期中提供了created,mounted方法,可以在页面初始化时候获取一些页面需要的数据,但是有的时候需要根据数据动态的为页面某些dom元素添加事件,这就要求在dom元素渲染完毕时去设置,但是created与mounted函数执行时一般dom并没有渲染完毕,所以就会出现获取不到,添加不了事件的问题,一开始没有发现 vm. nextTick([callback])domvuecreated,mounteddomdomcreatedmounteddomvm.nextTick( [callback] )方法时,使用定时器setInterval来循环判断元素是否存在,存在后设置事件,取消定时器,但是该方法实在不好,后来阅读vue文档时发现 vm.$nextTick( [callback] )函数。

2、在使用某个第三方插件时 ,希望在vue生成的某些dom动态发生变化时重新应用该插件,也会用到该方法,这时候就需要在 $nextTick 的回调函数中执行重新应用插件的方法。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值