当我们在使用Element UI中的Tag组件时,我们能看到这样的代码

this.$nextTick(_ => {
  this.$refs.saveTagInput.$refs.input.focus();
})

上述三行的代的作用是自动获取input输入框的焦点
this.$refs.saveTagInput.$refs.input.focus()是通过$refs获取input DOM对象,然后调用focus()方法自动获取焦点
$nextTick的作用是当页面上元素被重新渲染之后,才会执行回调函数

我们试想一下,如果没有使用$nextTick函数时,会出现什么后果呢?

如果我们直接执行this.$refs.saveTagInput.$refs.input.focus(),这时,input文本框还未被渲染在页面中,这个时候去获取input DOM对象,结果是会报错

Last modification:July 15th, 2020 at 05:26 pm
如果觉得我的文章对你有用,请随意赞赏