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 UI Dialog 创建友好的弹出对话框实现代码
Apr 12 Javascript
一个级联菜单代码学习及removeClass与addClass的应用
Jan 24 Javascript
js获取判断上传文件后缀名的示例代码
Feb 19 Javascript
基于JavaScript获取鼠标位置的各种方法
Dec 16 Javascript
模仿password输入框的实现代码
Jun 07 Javascript
微信小程序 教程之引用
Oct 18 Javascript
js 定位到某个锚点的方法
Nov 19 Javascript
清除浏览器缓存的几种方法总结(必看)
Dec 09 Javascript
基于Vue实现拖拽效果
Apr 27 Javascript
浅谈Vue 数据响应式原理
May 07 Javascript
基于mpvue搭建微信小程序项目框架的教程详解
Apr 10 Javascript
Vue如何实现监听组件原生事件
Jul 03 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设计模式之单例模式实例分析
2015/02/25 PHP
ThinkPHP实现更新数据实例详解(demo)
2016/06/29 PHP
基于php流程控制语句和循环控制语句(讲解)
2017/10/23 PHP
javascript 正则替换 replace(regExp, function)用法
2010/05/22 Javascript
web性能优化之javascript性能调优
2012/12/28 Javascript
JQuery slideshow的一个小问题(如何发现及解决过程)
2013/02/06 Javascript
js操作css属性实现div层展开关闭效果的方法
2015/05/11 Javascript
易被忽视的js事件问题总结
2016/05/14 Javascript
详谈jQuery Ajax(load,post,get,ajax)的用法
2017/03/02 Javascript
浅谈angularJS的$watch失效问题的解决方案
2017/08/11 Javascript
element ui 表格动态列显示空白bug 修复方法
2018/09/04 Javascript
微信小程序实现保存图片到相册功能
2018/11/30 Javascript
全面分析JavaScript 继承
2019/05/30 Javascript
微信小程序判断页面是否从其他页面返回的实例代码
2019/07/03 Javascript
vue调用语音播放的方法
2019/09/27 Javascript
ES6之Proxy的get方法详解
2019/10/11 Javascript
layui前端时间戳转化实例
2019/11/15 Javascript
Nuxt配置Element-UI按需引入的操作方法
2020/07/06 Javascript
python字符串排序方法
2014/08/29 Python
基础的十进制按位运算总结与在Python中的计算示例
2016/06/28 Python
Python中使用bidict模块双向字典结构的奇技淫巧
2016/07/12 Python
Python守护线程用法实例
2017/06/23 Python
Python多线程扫描端口代码示例
2018/02/09 Python
Python文件监听工具pyinotify与watchdog实例
2018/10/15 Python
python Qt5实现窗体跟踪鼠标移动
2019/12/13 Python
python 写一个性能测试工具(一)
2020/10/24 Python
详解通过HTML5 Canvas实现图片的平移及旋转变化的方法
2016/03/22 HTML / CSS
ShellScript面试题一则-ShellScript编程
2014/06/24 面试题
物流管理毕业生自荐信
2013/10/24 职场文书
就业自我评价
2014/02/04 职场文书
红旗方阵解说词
2014/02/12 职场文书
阳光体育活动方案
2014/02/16 职场文书
上级领导检查欢迎词
2015/09/30 职场文书
强烈推荐:小学生:暑假作息时间表(值得收藏)
2019/07/09 职场文书
MySQL主从复制断开的常用修复方法
2021/04/07 MySQL
使用 JavaScript 制作页面效果
2021/04/21 Javascript