将回调延迟到下次 DOM 更新循环之后执行
在created()钩子函数执行的时候DOM 其实并未进行任何渲染,而此时进行DOM操作并无作用,而在created()里使用this.$nextTick()可以等待dom生成后获取dom对象
<template>
<section>
<div ref="hello">
<h1>Hello World ~</h1>
</div>
<el-button type="danger" @click="get">点击</el-button>
</section>
</template>
<script>
export default {
methods: {
get() {}
},
created() {
console.log(111);
console.log(this.$refs['hello']);
this.$nextTick(() => {//dom渲染完成后在执行
console.log(222);
console.log(this.$refs['hello']);
});
}
}
</script>