对Vue.nextTick()和mounted()的理解

Vue.nextTick()在Vue生命周期的created()函数中进行DOM操作是要放在Vue.nextTick()回调函数中。原因就是created()在执行的时候DOM只是创建出来并没有渲染在页面上，因此页面上没有这个元素也就无法对其进行操作。当页面进行某个操作后，部分DOM随数据的改变而改变，这个时候就应该将这个操作放在Vue.nextTick()的回调函数中执行。mount...

Tempta36

6284人浏览 · 2018-07-27 09:43:00

Tempta36 · 2018-07-27 09:43:00 发布

Vue.nextTick()

在Vue生命周期的created()函数中进行DOM操作是要放在Vue.nextTick()回调函数中。原因就是created()在执行的时候DOM只是创建出来并没有渲染在页面上，因此页面上没有这个元素也就无法对其进行操作。

当页面进行某个操作后，部分DOM随数据的改变而改变，这个时候就应该将这个操作放在Vue.nextTick()的回调函数中执行。

mounted()

mounted()函数执行时所有的DOM的创建，布局和渲染都已完成。

参考链接

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^