使用 Axios 存储为 Blob 的 POST 图像 - VUEJS [英] POST Image which store as a Blob with Axios - VUEJS
本文介绍了使用 Axios 存储为 Blob 的 POST 图像 - VUEJS的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有一个存储为 Blob 的数据图像,但我不知道如何使用 Axios 发布它,我使用 VUEJS.请帮帮我.
I have a data Image which store as a Blob but I dont know how to post it with Axios, I use VUEJS. Please help me.
我的对象 API 由 VueDevtool
My Object API by VueDevtool
<file-upload v-model="files"></file-upload>
<button type="submit" v-on:click.prevent="Submit">Submit</button>
<script>
methods: {
data: function () {
return {
config: {
'headers': {'Authorization': 'JWT ' + this.$store.state.token},
'Content-Type': 'multipart/form-data'
}
},
methods:{
for (var file in this.files) {
let data = new FormData()
data.append('image', this.file[0])
data.append('caption', 'image')
data.append('user', this.Authuser)
api.post('/photos/create/', data, this.config)
}
}
}
</script>
推荐答案
您就快到了.您唯一需要做的是附加实际文件,您应该将 $event 传递给您的函数:Submit($event)
You are almost there. The only thing you need is to append the actual file and you should pass $event to your function as: Submit($event)
Submit(event) {
let URL = '....'
let data = new FormData()
data.append('name', 'image')
data.append('file', event.target.files[0])
let config = {
header : {
'Content-Type' : 'multipart/form-data'
}
}
axios.post(URL, data, config).then(response => {
console.log('response', response)
}).catch(error => {
console.log('error', error)
})
}
这篇关于使用 Axios 存储为 Blob 的 POST 图像 - VUEJS的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文