如何在Vue.js渲染界面后调用函数，构成一个长尾？

本文共计889个文字，预计阅读时间需要4分钟。

目录 + Vue.js 渲染完界面后调用函数 +

1.以下开始介绍 +

2.运行之后 +

3.此时应查询官方API文档发现 +

4.继续查询API文档 +

5.最终把watch和nextTick组合一起 +

6.运行后发现问题 + Vue渲染完成事件 + Vue内部机制

目录

• vue.js渲染完界面后调用函数
• 1.下面开始介绍下
• 2.运行之后
• 3.此时查询官方api文档发现
• 4.继续查询api文档发现
• 5.最终把watch和nextTick组合一起
• 6.运行后发现
• vue渲染完成事件
• vue里面本身带有两个回调函数

vue.js渲染完界面后调用函数

在使用vue.js框架的时候，有时候会希望在页面渲染完成之后，再执行函数方法来处理初始化相关的操作，如果只处理页面位置、宽或者高时，必须要在页面完全渲染之后才可以，页面没有加载完成之前，获取到的宽高不准确。

使用过jquery的都知道，有个ready方法可以使用，但vue.js则需要结合watch和nextTick方法来使用。

1.下面开始介绍下

在页面加载一个数据列表完成之后，页面自动滚动定位到中间某个列表元素，需要在列表数据渲染完成，计算列表高度，再控制定位到指定行。