通过 VueJS 选择 DOM 元素

Question

通过 VueJS 选择 DOM 元素

Ryo*_*ara 5 html javascript dom google-chrome-extension vuejs2

我使用清晰的 JavaScript 编写了一个 Chromium 扩展来与 DOM 交互，但现在我学习 VueJS 并重写了该扩展以使用 Vue。我发现一个问题：有一个<input>元素连接到Vue。

我通过bg.cpVue 实例的属性更改其值，现在我需要选择 DOM 元素。有没有办法使用 Vue 实例而不是使用来进行文本选择document.getElementById('test').select()？

最终目标是将<input>字段复制到剪贴板。

<body>
  <div id="appBg">
    <input v-model="cp" id="test">
  </div>
  <script>
  //vue instance of div with input field
  var bg = new Vue({
      el: "#appBg",
      data: {
        cp: ""
      }
    });
  </script>
</body>

Run Code Online (Sandbox Code Playgroud)

Answer 1

小智 8

您可以在 DOM 属性中使用 ref 并通过 js 部分中的 $refs 调用它

前任：

<input ref="inputName" />

Run Code Online (Sandbox Code Playgroud)

并在 js 部分调用

this.$refs.inputName

Run Code Online (Sandbox Code Playgroud)

在这里你可以阅读它的解释

归档时间：	6 年，3 月前
查看次数：	9478 次
最近记录：	6 年，3 月前