本人是在electron+vue项目上使用,如果使用无效,请自行调整或寻找他法。
1.样例代码
代码如下(示例):
<div
class="add-file-right"
style="height: 70px; margin-left: 100px; margin-top: 15px"
>
<div class="add-file-right-img" style="margin-left: 70px">
上传文件:
</div>
<input
type="file"
ref="clearFile"
id="filePath"
name="file"
@change="getFile($event)"
multiple="multiplt"
class="add-file-right-input"
style="margin-left: 70px"
/>
</div>
<script>
export default {
data() {
return {
filePath: "",
fileName: "",
};
},
methods: {
getFile(obj) {
var fileObj = document.getElementById("filePath").files[0];
this.filePath = fileObj.path;
this.fileName = fileObj.name;
console.log(this.filePath);
console.log(this.fileName);
},
},
};
</script>
选取文件以后就可以在控制台看到文件所在路径和文件名。