官方文檔:javascript
本身寫了一個小demo:java
<template> <div> <p ref="txt" v-if="show">{{message}}</p> <p>{{msg}}</p> <button @click="getTxt">點擊</button> </div> </template> <script> export default { name: "next-tick", data () { return { show: false, message: '原始文本', msg: '' } }, methods: { getTxt () { this.show = true this.$nextTick(()=> { this.msg = this.$refs.txt.innerHTML + '更新獲取文本' console.group(this.$refs.txt.innerHTML) }) } } } </script> <style scoped> </style>
總結了一下:若是使用v-show進行顯示隱藏,methods裏面是直接能夠獲取到文本值,若是用v-if,是不能獲取的文本值的。dom
this.nextTick是在下次dom更新循環完成以後進行調用的this