javascript - 如何在 Vue.js 中的方法内触发输入焦点事件?

标签 javascript vue.js vuejs2 vue-component bootstrap-vue

我有一个使用以下事件的输入:

 <b-nput
            class="input"
            id="link"
            v-model="link"
            placeholder="link"
            @focus="$event.target.select()"
          ></b-input>
我该如何使用 @focus="$event.target.select()"里面的事件:
上述方法复制该值。我需要在用户点击复制时触发上述选择焦点事件
如何正确实现?

最佳答案

添加 saved作为焦点事件处理程序的方法:

@focus="saved"
方法 :
methods: {
  saved(event){ //the event is passed automatically as parameter
     event.target.select()
  }
}

编辑 :
尝试添加ref到输入元素
 <b-input
          ref="input"
            class="input"
            id="link"
            v-model="link"
            placeholder="link"
         
            @focus="$event.target.select()"
          ></b-input>
然后在方法内部以编程方式触发焦点:
 methods: {
      async copy(s) {
      await navigator.clipboard.writeText(s) 
      this.$refs.input.focus();
     ...
    }
}  

关于javascript - 如何在 Vue.js 中的方法内触发输入焦点事件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/63448100/

相关文章:

javascript - FileContentResult - 防止浏览器缓存图像

javascript - 在新的浏览器选项卡中打开 pdf 内容

javascript - vuejs - 将组件保存到变量

javascript - 如何串联。 (点)与 javascript 中的数字

vue.js - vue-material state change ui update 弄乱了布局

javascript - 单击 <the> 将类添加到 div

javascript - "' 长度 ' in Object(obj)"在js中是如何工作的?

javascript - 使用v-model时调整v-text-field的值

vue.js - 如何用 Jest 测试 catch 函数

vue.js - 我有一个 Electron 项目,我想与它一起使用vueJS