v-file-input .click() 不是函数答案

【问题标题】：v-file-input .click() is not a functionv-file-input .click() 不是函数
【发布时间】：2020-11-11 18:27:03
【问题描述】：

我试图以编程方式触发 v-file-input 的 .click() 事件，因为它在 Vuetify 的文档中。

但它显示错误this.$refs.imagePicker.click is not a function 我在这里遗漏了什么吗？

我正在尝试使用某个按钮上传图片。就像那个按钮会触发 v-file-input 上的点击事件。

【问题讨论】：

'click' 是 Vuetify 的事件 $emitted 的名称，而不是用于触发该发射的内部方法名称。如果您提供了有关您尝试使用程序化触发器执行的操作的更多信息，则可以在尝试解决问题时获得更多帮助。
那么，解决方法是什么，就像使用某个按钮单击 html 标签一样？
我不确定函数名是不是onclick。你可以试试吗？
@MaxPeng onClick 在您单击输入时触发，而不是单击/激活它。
你可以this.$refs.image.$refs.input.click()。

【解决方案1】：

对于 vue 3，不推荐使用 refs。我发现解决方法是使用元素 ID。你可以使用

<v-file-input
  id="fileUpload"
  accept=".pdf"
  hide-input
  prepend-icon=""
/>
<div>
  <v-btn @click="getFile">
    UPLOAD
  </v-btn>
</div>

然后在您可以使用的按钮的事件函数上，

const getFile = function () {
  let fileUpload = document.getElementById('fileUpload')
  if (fileUpload != null) {
    fileUpload.click()
  }
}

【讨论】：

【解决方案2】：

@User28's solution（问题下方的 cmets 之一）有效：

this.$refs.image.$refs.input.click()

【讨论】：