将锚点标记中的输入类型文件用于下拉项目

Question

我正在尝试在锚标记中的一个下拉项中使用输入类型文件。

所以，这里我的代码就像

 <div className="dropdown-menu actions-text">
     <a className="dropdown-item" href="#" onClick={e => props.viewJob(e, item.id, item.jdName)}>
         <i className="fa fa-envelope mr-2 view-icon" />
         View JD
     </a>
     <a className="dropdown-item" href='#'>
         <i className="fa fa-cloud-upload mr-2 upload-icon" aria-hidden="true" />
         Upload Resume
     </a>
     <input type='file' title="" onChange={(e) => { props.uploadResumeFolder(e, item.id, item.jdName) }}
            directory="" webkitdirectory="" mozdirectory="" allowdirs="" multiple />
     <a className="dropdown-item" href="#"><i className="fa fa-download mr-2 download-icon" aria-hidden="true" />
         Download Tracker</a>
</div>

但是在这里，如果我在顶部再添加一个选项，则单击该文件选项的下一个。 默认情况下始终选择第二个。

那么，我该如何解决呢？

Answer 1

您是否尝试过做类似的事情？

<a href="#" onClick="(function(e){
    console.log('clicking', e);
    document.getElementById('X1').click();
})();">click here</a>

<input hidden type='file' title="" onChange="(function(e){
    console.log('changed file input', e)
})();" id="X1" />