Javascript 如何在Vue数据中存储FileList对象

你好，我试图在vue数据对象中存储一个文件列表对象，但它被存储为字符串“File”

我像这样给html添加了一个引用

<input type="file" @change="fileChange($event.target)">

因此，我得出以下结论：

---

您只需将参数

$event

传递到

fileChange（）

，而不是

$event.target

现在您可以使用

evt.target.files[0]访问文件对象内部
fileChange（）
函数


var vm=new Vue({
el:“#应用程序”，
数据：{
文件：{}
},
方法：{
文件更改（evt）{
this.file=evt.target.files[0]；
console.log（'file Object:==>'，this.file）；
}
}
});


名称：{{file.name}


大小：{{file.size}
&类型：{{file.type}

您只需将参数
$event
传递给
fileChange（）
，而不是
$event.target


现在您可以使用
evt.target.files[0]访问文件对象内部
fileChange（）
函数


var vm=new Vue({
el:“#应用程序”，
数据：{
文件：{}
},
方法：{
文件更改（evt）{
this.file=evt.target.files[0]；
console.log（'file Object:==>'，this.file）；
}
}
});


名称：{{file.name}


大小：{{file.size}
&类型：{{file.type}

this.file=e.target.files[0]
&
@change=“fileChange（$event）”
应该不知道vue，也不知道此控制台输出，但您确定这是一个字符串吗？这将是一个非常奇怪的字符串输出（
[object File]
在这里更受欢迎）。另外，不是拾取，但这是您试图存储在此处的文件对象。文件列表就是上面的对象。@Helpinghand也不起作用：（它仍然存储为[object File]@kaido是的，当我双击它时，它存储为[object File]。控制台会自动关闭，因为它是vue开发人员工具。
this.File=e.target.files[0]
&
@change=“fileChange（$event）”
workDon应该不知道vue，也不知道这个控制台输出，但你确定这是一个字符串吗？这将是一个非常奇怪的字符串输出（
[对象文件]
在这里会更常见）。另外，不要拾取，但这是一个你试图存储在这里的文件对象。文件列表就是上面的对象。@Helpinghand这也不起作用：（它仍然存储为[object File]@kaido是的，当我双击它时，它存储为[object File]。控制台会自动关闭，因为它是vue开发人员工具。
new Vue({
   el: '#someEl',
   data: {
      file: null
   },
   methods: {
      fileChange (file) {
        this.file = file.files[0]
      }
   }
})