在开发项目中,不免会用到input上传文件,今天就记录一下我项目中用到input上传文件的用法,代码如下:(我将原生按钮隐藏了)
<input
accept="*"
@change="importdata($event)"
ref="fileInput"
name="img"
id="upload_file"
type="file"
style="display:none;"
/>
<ele-btn
class="table-toolbar-btn"
v-show="userPermissions.includes('DEPimport')"
@click.native="$refs.fileInput.click()"
icon-class="import"
content="导入"
/>
对应的方法如下:不懂的可以私聊我喔,
// 导入
async importdata(e) {
// let that = this
let files = e.target.files || e.dataTransfer.files
console.log(files, 'files')
if (!files.length) return //if(!false) return 条件成立的时候返回
//调用接口
await teamWork
.importMembers({
file: files[0]
})
.then(res => {
//成功操作
})
},