Javascript 如何在Nuxt.js中使用v-file-input获取文件对象?
我已经使用Vuetify.js作为Nuxt.js的UI框架。 我想在输入我的应用程序文件时获取文件对象。 所以我在Vuetify.Js中使用了v-file-input组件 我编写了如下代码Javascript 如何在Nuxt.js中使用v-file-input获取文件对象?,javascript,typescript,vue.js,nuxt.js,vuetify.js,Javascript,Typescript,Vue.js,Nuxt.js,Vuetify.js,我已经使用Vuetify.js作为Nuxt.js的UI框架。 我想在输入我的应用程序文件时获取文件对象。 所以我在Vuetify.Js中使用了v-file-input组件 我编写了如下代码 <template> <div> <v-file-input label="fileinput" multiple v-model="files&
<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>
从“nuxt属性装饰器”导入{Component,Vue}
@组件({})
导出默认类扩展Vue{
文件:any=[]
fileObj:any={}
异步getFileObject(文件:任意){
this.fileObj=等待文件
console.log(this.fileObj)
}
}
我使用console.log检查了文件对象。
但是'this.fileObj'是未定义的。
输入文件时如何获取文件对象?
有人能告诉我吗?如果从处理程序中删除空参数,它应该隐式传递。它还应该位于用作输入的
v型的此.files
上:
@change=“getFileObject”
方法:{
getFileObject(文件:任意){
console.log(文件);
console.log(this.files)
}
}
如果从处理程序中删除空参数,则应隐式传递它。它还应该位于用作输入的v型的此.files
上:
@change=“getFileObject”
方法:{
getFileObject(文件:任意){
console.log(文件);
console.log(this.files)
}
}
事件有一个参数,该参数包含在文件数组中:
@change="getFileObject($event)"></v-file-input>
事件有一个参数,该参数包含在文件数组中:
@change="getFileObject($event)"></v-file-input>
看这里:看这里:非常感谢你的回答!我意识到我需要在事件处理程序中添加一个参数,就像您的答案一样。非常感谢!不客气,@change=“getFileObject($event)”
允许您根据需要传递其他参数,并且文件:File[]
强制执行键入我希望像键入脚本一样编写以强制执行键入,但我对文件对象没有任何想法。我真的理解。谢谢!非常感谢你的回答!我意识到我需要在事件处理程序中添加一个参数,就像您的答案一样。非常感谢!不客气,@change=“getFileObject($event)”
允许您根据需要传递其他参数,并且文件:File[]
强制执行键入我希望像键入脚本一样编写以强制执行键入,但我对文件对象没有任何想法。我真的理解。谢谢!