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 相关文章推荐
jquery无缝向上滚动实现代码
Mar 29 Javascript
JS使用getComputedStyle()方法获取CSS属性值
Apr 23 Javascript
javascript中定义类的方法汇总
Dec 28 Javascript
最流行的Node.js精简型和全栈型开发框架介绍
Feb 26 Javascript
完美实现bootstrap分页查询
Dec 09 Javascript
JS日程管理插件FullCalendar简单实例
Feb 07 Javascript
浅析JavaScript中var that=this
Feb 17 Javascript
Angular 4环境准备与Angular cli创建项目详解
May 27 Javascript
jQuery回调方法使用示例
Jun 26 jQuery
详解如何让InstantClick兼容MathJax、百度统计等
Sep 12 Javascript
JS动态添加元素及绑定事件造成程序重复执行解决
Dec 07 Javascript
vue 使用Jade模板写html,stylus写css的方法
Feb 23 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的加密方式及原理
2012/06/14 PHP
php使用多个进程同时控制文件读写示例
2014/02/28 PHP
php单文件版在线代码编辑器
2015/03/12 PHP
PHP实现获取客户端IP并获取IP信息
2015/03/17 PHP
yii数据库的查询方法
2015/12/28 PHP
php模拟post提交请求调用接口示例解析
2020/08/07 PHP
js类 from qq
2006/11/13 Javascript
javascript基础的动画教程,直观易懂
2007/01/10 Javascript
突发奇想的一个jquery插件
2010/11/19 Javascript
仿jQuery的siblings效果的js代码
2011/08/09 Javascript
IE事件对象(The Internet Explorer Event Object)
2012/06/27 Javascript
基于jquery库的tab新形式使用
2012/11/16 Javascript
jQuery - css() 方法示例详解
2014/01/16 Javascript
Javascript实现简单的富文本编辑器附演示
2014/06/16 Javascript
wangEditor编辑器失去焦点后仍然可以在原位置插入图片分析
2015/05/06 Javascript
javascript制作幻灯片(360度全景图片)
2015/07/28 Javascript
Node.js通过身份证号验证年龄、出生日期与性别方法示例
2017/03/09 Javascript
Vue.js仿Metronic高级表格(二)数据渲染
2017/04/19 Javascript
Vue keep-alive实践总结(推荐)
2017/08/31 Javascript
BootStrap点击保存后实现模态框自动关闭的思路(模态框)
2017/09/26 Javascript
webpack多入口多出口的实现方法
2018/08/17 Javascript
javascript设计模式 ? 状态模式原理与用法实例分析
2020/04/22 Javascript
Vue中keep-alive组件的深入理解
2020/08/23 Javascript
Python、Javascript中的闭包比较
2015/02/04 Python
Python错误: SyntaxError: Non-ASCII character解决办法
2017/06/08 Python
Python基于Tkinter模块实现的弹球小游戏
2018/12/27 Python
解决Python图形界面中设置尺寸的问题
2020/03/05 Python
keras小技巧——获取某一个网络层的输出方式
2020/05/23 Python
css3制作彩色边线3d立体按钮的示例(css3按钮)
2014/05/06 HTML / CSS
函数指针的定义是什么
2016/08/14 面试题
标准毕业生自荐信范文
2013/11/04 职场文书
接受捐赠答谢词
2014/01/27 职场文书
初三政治教学反思
2014/01/30 职场文书
原材料检验岗位职责
2014/03/15 职场文书
中国世界遗产导游词
2015/02/13 职场文书
初中语文教学研修日志
2015/11/13 职场文书