vue的nextTick方法详解

我在学ssm+vue项目的时候看导前端这样一段代码有点不理解，因为我是写后端的，前端的知识不是很理解。

话不多说，进入正题。

这个this.nextTick(callback)函数是在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的 DOM。

上面的这个是vue官方的解释，我的理解就是如果语句需要在更新DOM资源后执行，就需要nextTick回调函数；

比如页面需要做数组添加数据操作，我要获取数组添加之后的长度，那就需要放到nextTick回调函数当中执行，

如果不放到nextTick里面执行那就等于是获取的是渲染之前数组的长度，也就是说还是添加之前原来数组的长度，

如果放到nextTick回调函数中，那就是等这个函数执行添加数据操作完毕，视图渲染了之后，再去执行nextTick里面的函数，这时候就是最新数组的长度，

当然如果你想在这个函数里面一次性添加3条或者是n条数组类型数据，nextTick回调函数里面获取数组长度也是最新的数组长度，也就是页面显示的数组长度，这样应该能理解了吧。

现在回到我遇到的问题：

 

 我当时不理解的是为啥我要弹出修改密码的窗口还要放到这个函数里面，后来才知道如果不加这个函数，那下面弹出这个框的时候updatePasswordVisible还是false，也就是还没更新，它也就还是隐藏状态，就算我把更新的窗口弹出来，在主页面还是隐藏的，所以要等它这个属性完成异步更新之后再去弹出修改密码的框，我废话这么多，其实我已经把要讲的重点已经写在图片里的注释当中！提醒自己以后遇到这个函数要理解它的作用，前端还是要花更多时间去学习的。