你好,我试图在 vue 数据对象中存储 FileList 对象,但它被存储为字符串“File”
我像这样向 html 添加引用
<input type="file" @change="fileChange($event.target)">
在 JavaScript 中
new Vue({
el: '#someEl',
data: {
file: null
},
methods: {
fileChange (file) {
this.file = file.files[0]
}
}
})
最佳答案
您只需将参数 $event
传递给 fileChange()
,而不是 $event.target
。
现在,您可以使用 fileChange()
函数内的 evt.target.files[0];
访问文件对象。
var vm = new Vue({
el: '#app',
data: {
file: {}
},
methods: {
fileChange (evt) {
this.file = evt.target.files[0];
console.log('file Object:==>',this.file);
}
}
});
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.js" type="text/javascript"></script>
<div id="app">
<p>
<input type="file" @change="fileChange($event)">
name: <b>{{file.name}}</b>
</p>
<p>
size: <b>{{file.size}} </b>
& type: <b>{{file.type}}</b>
</p>
</div>
关于javascript - 如何在Vue数据中存储FileList对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52007077/