文档：深入响应式原理
Vue 实现响应式并不是数据发生变化之后 DOM 立即变化，而是按一定的策略进行 DOM 的更新。
$nextTick 是在下次 DOM 更新循环结束之后执行延迟回调，在修改数据之后使用 $nextTick，则可以在回调中获取更新后的 DOM。
例子：
初始化数据：
定义方法：
页面效果：
然后我们现在试着点击触发修改：
可以看到，msg已经变成了Hello world，在changeMsg()方法中，先修改msg的值成为‘Hello world’，然后通过拿到dom的值再依次修改msg1、msg2、msg3的值，此时修改得到的msg1依然是‘hello vue’，this.$nextTick中修改得到的msg2则是‘hello world’，msg3依然是‘hello vue’，也就是说，在changeMsg()方法触发后，修改了msg的值，但是此时再通过dom取到的值还未改变，所以可以知道：
vue响应式的改变一个值以后，此时的dom并不会立即更新，如果需要在数据改变以后立即通过dom做一些操作，可以使用$nextTick获得更新后的dom。
希望本文对你有所帮助！
随机推荐
-
c# 号码记录，车友
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...
-
sh - 脚本学习 启动/停止/重启/部署jetty crontab
===============jettytest.sh ====================== #!/bin/shjettysh_path=/usr/local/jetty/bin/jetty. ...
-
在jsp中应如何避免，request.getContextPath();等get报错问题
导致request中的大部分get方法无法获取,是因为没有依赖的jar包.就像这样.这里不仅仅有getContextPath()方法报错,如果存在这个问题,大部分的request方法都不可用. 解决这 ...
-
C# 比较两个路径是否指向同一对象
string path1 = @"c:\test\rootpath"; string path2 = @"C:\TEST\..\TEST\ROOTPATH"; ...
-
Web前端新手想提升自身岗位竞争力，需做好这3件事！
Web前端开发行业的发展前景毋庸置疑,只要是互联网企业,几乎都需要Web前端开发工程师.虽然Web前端入行门槛低,但竞争逐渐激烈,想要取得高薪,就一定要具备强大的实力.那么,在重庆Web前端培训学习中 ...
-
cliipblard.js 实现点击复制
<script src="js/clipboard.min.js"></script> <script type="text/javascr ...
-
中文分词算法工具hanlp源码解析
词图 词图指的是句子中所有词可能构成的图.如果一个词A的下一个词可能是B的话,那么A和B之间具有一条路径E(A,B).一个词可能有多个后续,同时也可能有多个前驱,它们构成的图我称作词图. 需要稀疏2维 ...
-
11g R2 RAC 虚拟机
虚拟机安装RAC文档 本文档包含内容 一:安装系统 二:各节点配置系统参数 三:虚拟机创建共享存储 四:配置磁盘绑定 五:安装GRID 六:创建ASM DG 七:安装database 八:安装碰到的问 ...
-
vue route
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
-
知识点：spring 完全手册
什么是spring spring是一个开源框架,为简化企业级开发而生,使用spring可以使简单的java bean 实现以前只有EJG才能实现的功能. Spring是一个轻量级的控制反转(IoC)和 ...