如何在Nuxt.js中使用v- file -input获取文件对象？
如何在Nuxt.js中使用v- file -input获取文件对象？
提问于 2020-12-08 04:28:26
我使用Vuetify.js作为Nuxt.Js的UI框架。当我输入文件我的应用程序时，我想获取文件对象。因此，我在Vuetify.Js中使用了v-file-input组件，并编写了如下代码。
<template>
<div>
<v-file-input
label="fileinput"
multiple
v-model="files"
@change="getFileObject()"></v-file-input>
</div>
</template>
<script lang="ts">
import { Component, Vue } from 'nuxt-property-decorator'
@Component({})
export default class extends Vue{
files:any = []
fileObj:any = {}
async getFileObject(file:any){
this.fileObj = await file
console.log(this.fileObj)
}
}
</script>我使用console.log检查了文件对象。但是'this.fileObj‘是未定义的。如何在输入文件时获取文件对象？有人能给我一些建议吗？
回答 2
Stack Overflow用户
回答已采纳
发布于 2020-12-08 04:40:59
@change事件有一个文件数组中的参数：
@change="getFileObject($event)"></v-file-input> 然后在脚本中：
async getFileObject(files:File[]){
this.fileObj = await files
console.log(this.fileObj)
}Stack Overflow用户
发布于 2020-12-08 04:33:45
如果从处理程序中删除了空参数，则应隐式传递该参数。它还应位于用作输入的v-model的this.files上
@change="getFileObject"methods: {
getFileObject(file:any) {
console.log(file);
console.log(this.files)
}
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/65188888
复制相关文章
相似问题
腾讯云开发者
