[英]How to get file path from File object observer in v-file-input Vuetify?
[英]How to get file object using v-file-input in Nuxt.js?
我使用了 Vuetify.js 作为 Nuxt.Js 的 UI 框架。 当我输入文件我的应用程序时,我想获取文件 object。 所以我在 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 检查了文件 object。 但“this.fileObj”未定义。 输入文件时如何获取文件 object? 谁能给我建议?
如果你从处理程序中删除空参数,它应该被隐式传递。 它也应该在用作输入的v-model
的this.files
上:
@change="getFileObject"
methods: {
getFileObject(file:any) {
console.log(file);
console.log(this.files)
}
}
@change事件有一个参数,文件数组:
@change="getFileObject($event)"></v-file-input>
然后在脚本中:
async getFileObject(files:File[]){
this.fileObj = await files
console.log(this.fileObj)
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.