vue把elementUi的输入框当做文件选择框使用,使用技巧

我们知道input只能有输入、输入、改变和鼠标进入等事件,并没有点击事件,但是如果有一个输入框,想让用户选择下载路径选择,该如何修改?

其实刚开始,我是想使用元素获取焦点事件,然后通过处理这个焦点事件,打开对话框,然后选择文件,但是这里有个问题,就是选择完文件之后,这个元素还是获取焦点,然后就会继续打开对话框,无限循环........,即便你通过e.target.blur() 让输入框失去了焦点,但是因为这是ui框架包装的输入框,所以还是会继续获取焦点,所以这个方案废弃 

然后我就在想,既然这个输入框不能使用click事件,那给它包一个元素,在外层元素上绑定点击事件,然后通过事件冒泡来实现呢?嗯,经过我的不懈努力,这个方案不错

然后就成功获取到了路径:而且没有无限循环问题

相关文章

这篇文章我们将通过debug源码的方式来带你搞清楚defineAsync...
欧阳老老实实的更新自己的高质量vue源码文章,还被某2.6k st...
前言 在Vue3.5版本中响应式 Props 解构终于正式转正了,这个...
组合式 (Composition) API 的一大特点是“非常灵活”,但也因...
相信你最近应该看到了不少介绍Vue Vine的文章,这篇文章我们...
前言 在欧阳的上一篇 这应该是全网最详细的Vue3.5版本解读文...