vue进入页面时触发input的点击事件？

Question

input是上传图片的，怎么在页面打开时触发点击事件进行图片选择？
想让用户在进入页面时就可以上传图片了，而不是需要点击一次后再上传

<input id="license" type="file" accept="image/*" ref="cameraPhotoInput_license" prop="license">

Answer 1

你这个也没绑定click事件，如果要触发点击事件的话，可以this.$refs.cameraPhotoInput_license.click()试试，最好在$nextTick中调用

Answer 2

给个autofocus让输入框自动聚焦，然后@focus来触发自定义方法试试，我记得autofocus有的平台会有问题，楼主可能要用到自定义指令这一块的东西，先试试能不能实现~~

Answer 3

意味着调起图片选择器或者相机是自动触发的吗？

可以在进入页面的页面组件的生命周期中，使用js中 HTMLElement 的 dispatchEvent，例如类似下面的代码。

<script>
  mounted() {
    // 核心代码
    const trigger = () => {
      const $el = this.$refs.input.$el;
    
      $el.dispatchEvent(new Event('click'));
    }
    if (!this.$refs.input) {
      this.$nextTick(trigger.bind(this))
    } else {
      trigger();
    }
  }
</script>