Vue：如何将焦点设置在输入字段上答案

【问题标题】：Vue: how to set the focus on an input fieldVue：如何将焦点设置在输入字段上
【发布时间】：2021-03-18 20:14:23
【问题描述】：

当我加载页面时，我希望焦点转到输入字段

  <b-form-input
    placeholder="Name *"
    name="name"
    autofocus
  ></b-form-input>

但它不起作用

我该怎么办？

【问题讨论】：

【解决方案1】：

当我将您的代码插入 HTML 文件时，它什么也没做，什么也没显示。只需删除b-form- 它就可以工作，并且当我在没有我这样做的情况下加载页面时它也能集中注意力。所以我想这行得通，有点。但是我不太了解 vue，所以我希望这不是大错特错，b-form 完全没问题，在这种情况下我很抱歉。

【讨论】：

我试图删除 b-form- 就像你告诉我的那样，但它不起作用。 b-form- 我把它放出来是因为我使用的是 boostrap vue
好吧，对不起，我对vue了解不多。但只是在一个空的 .html 中使用 <input placeholder="Name *" name="name" autofocus></input> 就可以了。

【解决方案2】：

给输入添加一个引用：

  <b-form-input
    placeholder="Name *"
    name="name"
    autofocus
    ref="nameRef"
  ></b-form-input>

然后在挂载的钩子中：

mounted(){
  this.$refs.nameRef.focus()
}

【讨论】：