理解:
nextTick()方法是DOM更新之后,后台的数据已经发生变化,但是页面没改变,获取更新之后数据的方法。
<template>
<div id="app"
<button ref="info" @click='infoTree'>{{name}}</button>
</div>
</template>
<script>
export default {
data () {
return {
name: '这是个选择题!'
}
},
methods: {
infoTree () {
this.name = '这是抉择!'
console.log(this.$refs.info.name) // 结果:这是个选择题!
this.$nextTick(() => {
console.log(this.$refs.info.name) // 结果:这是抉择!
})
}
}
}
</script>
结果:这是没点击时候的显示,也就是页面没更新数据的值
这是点击之后的显示,页面后台都已经一致的数据