vue2知识点：nextTick语法

文章目录

• ​​3.24 nextTick语法​​
• ​​本人其他相关文章链接​​

3.24 nextTick语法

说明：类似于定时器的功能

问题：什么场景会使用它呢？

答案：举例我想有个input输入框，我还有个“编辑”按钮，如图1，如图2，点击“编辑”按钮input输入框就聚焦，失焦就修改成功输入框的值。如图3你想实现45行到50行代码执行完，页面模板就重新解析渲染更新数据，然后你执行52行代码输入框就聚焦了，但实际页面显示压根不聚焦为啥？因为vue会把整个方法都执行完才会去渲染更新DOM节点（为啥要这么设计？因为如果一个方法里面修改8个属性值，我每修改一个DOM就渲染一次也太消耗资源了，所以设计成方法执行完毕了，用户属性都修改好了，我再去渲染DOM节点），所以52行会先执行，但是DOM还没渲染且输入框还没出来了，上哪里聚焦去，所以就出现了点击“编辑”按钮输入框聚焦失败的场景。

图1

图2

图3