结合elementUI的Tag标签的动态编辑标签谈一下this.$nextTick([callback])

<el-input
  v-if="inputVisible"
  ref="saveTagInput"
>
</el-input>
<el-button v-else @click="showInput">+ New Tag</el-button>

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

showInput方法的作用是由按钮切换为input框时，让input框获得焦点

Vue 在更新 DOM 时是异步执行的，当设置 this.inputVisible = true时，el-input组件不会立即重新渲染，此时展示的还是button按钮，拿不到input框this.$refs.saveTagInput.$refs.input，会报错。

this.$nextTick([callback])的作用是在页面元素被重新渲染后调用回调函数里面的代码