使用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.
VueDevtool的My Object API
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屋!
查看全文