VUE项目中无法触发隐藏input[type=file]的事件

Question

VUE的一个页面组件在activeted的时候调用一个函数，创建一个input[type=file]标签，然后点击。函数代码如下：quickPhoto() {        // 创建input      let file = document.createElement('input')      file.setAttribute('type', 'file')      file.setAttribute('capture', 'camera')      file.setAttribute('accept', 'image/*')      file.style.display = 'none'      document.querySelector('body').appendChild(file)      file.addEventListener('change', ()=>{        this.$vux.loading.show()        //压缩图片        this.$utils.$imgCompress(file.files[0]).then(img=>{          this.$vux.loading.hide()          this.params.problemImgs.push(img)          file.value=""          delete file.parentNode.removeChild(file)        }).catch(e=>{          this.$vux.loading.hide()          alert(e)        })      })      file.addEventListener('click', ()=>{        console.log('click')      })      file.click()      window.quickPhoto = window.quickPhoto || this.quickPhoto    }页面打开后可以在console看到click，但是没有弹出选择图片的窗口。但是在控制台手动调用quickPhoto()就可以弹出窗口选择图片，求解。

Answer 1

浏览器不允许js脚本自动打开文件选择, 必须是用户操作才可以