this.$nextTick 将回调延迟到下次DOM更新循环之后执行。
<template>
<div ref="ref_test" @click="testClick()" style="cursor: pointer">
{{ content }}
</div>
</template>
<script>
export default {
data() {
return {
content: "旧数据",
};
},
methods: {
testClick() {
this.content = "新数据";
console.log(
"this.$refs.ref_test.innerText11111111",
this.$refs.ref_test.innerText
);
this.$nextTick(() => {
console.log(
"this.$refs.ref_test.innerText nextTick:",
this.$refs.ref_test.innerText
);
});
console.log(
"this.$refs.ref_test.innerText22222222",
this.$refs.ref_test.innerText
);
},
},
};
</script>