Vue.js 为什么可以'；我不能通过道具触发输入文件吗？

我试图打开一组文件，但通过将道具传递给组件（为了方便起见，我需要这个）。有办法做到这一点吗

以下代码中的变量不适合我：

  <input type="file" ref="input" hidden>

  <button @click="() => { $refs.input.click() }">Choose file</button>

---

如果不是从click事件内部触发，它将不起作用

您可以做的是在子组件内创建一个方法，该方法可以从事件侦听器回调中的父组件调用

const compo=Vue.component（“compo”{
模板：“”，
安装的（）{
此.refs.input.addEventListener（'click'，e=>{
console.log（'clicked:'，e.target）
})
},
方法：{
开（）{
这是.$refs.input.click（）
}
}
})
新Vue({
el:“#应用程序”，
组成部分：{
复合
},
数据（）{
返回{
propForComponent:false
};
},
方法：{
onClick（）{
此.$refs.compo.open（）
}
}
})

选择文件

您想告诉我们您是如何编码的吗？请参阅@Bert多谢！非常感谢你的帮助！我认为这样父组件和子组件就耦合起来了。我认为使用slot是最好的方法：还是我错了？您的代码返回“消息”：“未捕获引用错误：未定义Vue”，@Fernandorres该错误意味着您没有正确导入Vue。@JulianPaoloDayag您答案中的示例代码返回该错误，因为我只将其用于格式化，而不是实际的工作演示。阅读代码就足够了。

this.$refs.input.addEventListener('click', e => {
  console.log('clicked: ', e.target)
})