vue2.0$nextTick监听数据渲染完成之后的回调函数方法


Posted in Javascript onSeptember 11, 2018

vue里面本身带有两个回调函数:

一个是`Vue.nextTick(callback)`,当数据发生变化,更新后执行回调。

另一个是`Vue.$nextTick(callback)`,当dom发生变化,更新后执行的回调。

栗子:

...
<ul id="demo">
 <li v-for="item in list">{{item}}</div>
</ul>
...
new Vue({
 el:'#demo',
 data:{
  list=[0,1,2,3,4,5,6,7,8,9,10]
 },
 methods:{
  push:function(){
   this.list.push(11);
   this.nextTick(function(){
    alert('数据已经更新')
   });
   this.$nextTick(function(){
    alert('v-for渲染已经完成')
   })
  }
 }
})

以上这篇vue2.0$nextTick监听数据渲染完成之后的回调函数方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Code:loadScript( )加载js的功能函数
Feb 02 Javascript
jQuery LigerUI 使用教程入门篇
Jan 18 Javascript
jQuery插件开发全解析
Oct 10 Javascript
JS控件的生命周期介绍
Oct 22 Javascript
Jquery $.getJSON 在IE下的缓存问题解决方法
Oct 10 Javascript
jquery实现在网页指定区域显示自定义右键菜单效果
Aug 25 Javascript
angularJS之$http:与服务器交互示例
Mar 17 Javascript
ng-zorro-antd 入门初体验
Dec 03 Javascript
p5.js临摹动态图形的方法
Oct 23 Javascript
Vue.js实现大屏数字滚动翻转效果
Nov 29 Javascript
JS实现移动端双指缩放和旋转方法
Dec 13 Javascript
JS co 函数库的含义和用法实例总结
Apr 08 Javascript
Angular6 正则表达式允许输入部分中文字符
Sep 10 #Javascript
vue中使用input[type=&quot;file&quot;]实现文件上传功能
Sep 10 #Javascript
详解Eslint 配置及规则说明
Sep 10 #Javascript
bootstrap自定义样式之bootstrap实现侧边导航栏功能
Sep 10 #Javascript
vue弹窗组件的实现示例代码
Sep 10 #Javascript
vue axios数据请求及vue中使用axios的方法
Sep 10 #Javascript
vue插件实现v-model功能
Sep 10 #Javascript
You might like
十天学会php之第四天
2006/10/09 PHP
推荐一款MAC OS X 下php集成开发环境mamp
2014/11/08 PHP
PHP SPL标准库之SplFixedArray使用实例
2015/05/12 PHP
我见过最全的个人js加解密功能页面
2007/12/12 Javascript
jQuery 定时局部刷新(setInterval)
2010/11/19 Javascript
基于jQuery的简单的列表导航菜单
2011/03/02 Javascript
用JQuery实现表格隔行变色和突出显示当前行的代码
2012/02/10 Javascript
jquery 滚动条事件简单实例
2013/07/12 Javascript
框架页面高度自动刷新的Javascript脚本
2013/11/01 Javascript
jQuery中$(function() {});问题详解
2015/08/10 Javascript
jquery实现表格中点击相应行变色功能效果【实例代码】
2016/05/09 Javascript
jQuery ui autocomplete选择列表被Bootstrap模态窗遮挡的完美解决方法
2016/09/23 Javascript
jQuery动态移除和添加背景图片的方法详解
2017/03/07 Javascript
详解Vue 方法与事件处理器
2017/06/20 Javascript
详解react-redux插件入门
2018/04/19 Javascript
vue移动端实现红包雨效果
2020/06/23 Javascript
Vue引用Swiper4插件无法重写分页器样式的解决方法
2018/09/27 Javascript
layer.prompt使文本框为空的情况下也能点击确定的方法
2019/09/24 Javascript
原生JS实现萤火虫效果
2020/03/07 Javascript
解决vue项目运行npm run serve报错的问题
2020/10/26 Javascript
用实例分析Python中method的参数传递过程
2015/04/02 Python
django项目运行因中文而乱码报错的几种情况解决
2017/11/07 Python
Python常见MongoDB数据库操作实例总结
2018/07/24 Python
python得到qq句柄,并显示在前台的方法
2018/10/14 Python
python中退出多层循环的方法
2018/11/27 Python
python 检查文件mime类型的方法
2018/12/08 Python
使用python的pexpect模块,实现远程免密登录的示例
2019/02/14 Python
2019 Python最新面试题及答案16道题
2019/04/11 Python
python爬虫之快速对js内容进行破解
2019/07/09 Python
python 实现字符串下标的输出功能
2020/02/13 Python
python和C++共享内存传输图像的示例
2020/10/27 Python
HTML5地理定位与第三方工具百度地图的应用
2016/11/17 HTML / CSS
Oral-B荷兰:牙医最推荐的品牌
2020/02/25 全球购物
2014年学校卫生工作总结
2014/11/20 职场文书
工作感言一句话
2015/08/01 职场文书
朋友离别感言
2015/08/04 职场文书