为了在数据变化之后等待 Vue 完成更新 DOM,可以在数据变化之后立即使用Vue.nextTick(callback)。这样回调函数将在 DOM 更新完成后被调用。
在组件内使用 vm.$nextTick() 实例方法特别方便,因为它不需要全局 Vue,并且回调函数中的 this 将自动绑定到当前的 Vue 实例上。
例如,清空输入框之后光标定位到输入框
<div class="dataSearch fr"> <input type="text" class="dataSearch_input fl" ref="searchinput" v-model="searchval" placeholder="搜索"> <input type="button" class="dataSearch_bnt fl" @click="search"> <i class="cancelSearch" v-show="searchval" @click="searchval=‘‘;$nextTick(() => $refs.searchinput.focus());"></i> </div>
methods下写:
methods: { ondbclick() { this.isEdit = true; this.$nextTick(() => this.$refs.editTask.focus()); }, }
原文:https://www.cnblogs.com/yycc11/p/15071547.html