当data中的某个属性改变的时候，这个值并不是立即渲染到页面上，而是先放到watcher队列上（异步），只有当前任务空闲的时候才会去执行watcher队列上的任务。所以导致，改变的数据挂载到dom上会有一定的延迟，这也就导致了，当我们在改变属性值的时候，立即通过dom去拿改变的值时发现拿到的值并不是改变的值，而是之前的值。

this.$nextTick作用：在下次dom更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获得更新后的dom

this.$nextTick()作用的更多相关文章

  1. Vue-----this.$nextTick()

    Vue-----this.$nextTick() $nextTick Vue.nextTick()是在下次 DOM 更新循环结束之后执行延迟回调,在修改数据之后使用 $nextTick,则可以在回调中 ...

  2. Vue.js 面试题整理

    Vue项目结构介绍 build 文件夹:用于存放 webpack 相关配置和脚本. config 文件夹:主要存放配置文件,比如配置开发环境的端口号.开启热加载或开启gzip压缩等. dist 文件夹 ...

  3. Vue.js面试整理

    Vue项目结构介绍 build 文件夹:用于存放 webpack 相关配置和脚本. config 文件夹:主要存放配置文件,比如配置开发环境的端口号.开启热加载或开启gzip压缩等. dist 文件夹 ...

  4. 整理Vue.js 面试题

    Vue.js 面试题整理   Vue项目结构介绍 build 文件夹:用于存放 webpack 相关配置和脚本. config 文件夹:主要存放配置文件,比如配置开发环境的端口号.开启热加载或开启gz ...

  5. better-scroll 的使用

    1.安装 cnpm install better-scroll --save 2.引入 import BScroll from "better-scroll"; 3.初始化 dat ...

  6. 三本毕业（非科班），四次阿里巴巴面试，终拿 offer（大厂面经）

    作者:gauseen 原文:https://github.com/gauseen/blog 公众号:「学前端」,只搞技术不搞广告文,欢迎关注~ 第一次 20:00 电话一面 - 自我介绍 - 对公司工 ...

  7. 前端经典面试题vue面试题

    1.什么是MVVM? MVVM是一种设计思想. Model 层代表数据模型,也可以在Model中定义数据修改和操作的业务逻辑: View 代表UI 组件,它负责将数据模型转化成UI 展现出来,View ...

  8. 理解 $nextTick 的作用

    有同学在看 Vue 官方文档时,对 API 文档中的 Vue.nextTick 和 vm.$nextTick 的作用不太理解. 其实如果看一下深入响应式原理 - vue.js中的有关内容,可能会有所理 ...

  9. $nextTick 的作用

    文档:深入响应式原理 Vue 实现响应式并不是数据发生变化之后 DOM 立即变化,而是按一定的策略进行 DOM 的更新. $nextTick 是在下次 DOM 更新循环结束之后执行延迟回调,在修改数据 ...

随机推荐

  1. 环境准备—之—linux下安装svn--开机自启--及format权限问题

    借鉴自 http://www.cnblogs.com/liuxianan/p/linux_install_svn_server.html 这个很详细,但不是我的风格 https://blog.csdn ...

  2. (6)tcp-socket

    (1)client端口: import socket# 产生一个socket对象sk = socket.socket()# 建立连接sk.connect( ("127.0.0.1" ...

  3. 剑指Offer-和为S的连续正数序列

    题目: 小明很喜欢数学,有一天他在做数学作业时,要求计算出9~16的和,他马上就写出了正确答案是100.但是他并不满足于此,他在想究竟有多少种连续的正数序列的和为100(至少包括两个数).没多久,他就 ...

  4. java既然存在gc线程，为什么还存在内存泄漏？

    java既然存在gc线程,为什么还存在内存泄漏? 1.既然 Java 的垃圾回收机制能够自动的回收内存,怎么还会出现内存泄漏的情况呢?这个问题,我们需要知道 GC 在什么时候回收内存对象,什么样的内存 ...

  5. input表单验证

    1.屏蔽输入法(只是不能输入中文还可以输入特殊字符)<input style="ime-mode:disabled" onkeydown="if(event.key ...

  6. Could not get JDBC Connection--java

    postMan上调用合同服务,后台运行错误,如下: { "timestamp": 1536203887641, "status": 500, "err ...

  7. kafka AdminClient 闲时关闭连接

    AdminClient 类提供了创建.删除 topic 的 api. 在项目中创建了一个 AdminClient 对象,每次创建 topic 时,调用 org.apache.kafka.clients ...

  8. js--map函数的使用

    map( )  属于操作数组的方法. 包含三个参数,item,index,arr 看一份代码: let arr = [ {title:'aaa',hot:true}, {title:'fff',hot ...

  9. zabbix实现对磁盘性能动态监控

    前言 zabbix一直是小规模互联网公司服务器性能监控首选,首先是免费,其次,有专门的公司和社区开发维护,使其稳定性和功能都在不断地增强和完善.zabbix拥有详细的UI界面和分组策略,在被监控的服务 ...

  10. 建设工程造价数据服务云平台(计价BIM)

    经过多次沟通和对招标文件的理解,招标人通过软件平台建立和使用人员库.项目库.材料设备价格库.数据库等四库的真实需求,本着招标人对“成果文件”(指造价.招标代理的计价成果),即“项目库”的计价文件,不打 ...