FormData使用axios发送空数据 [英] FormData sends empty data using axios

查看:128
本文介绍了FormData使用axios发送空数据的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想将数据从vue发送到api.我不知道为什么我的formData为空.您可以看到快照附件.我已经尝试使用几个小时在stackoverflow上的几个链接

我的确认方法:

 异步确认(){让formData = new FormData()让参数= {名称:this.product.name,department_id:this.departmentId,category_id:this.categoryId,sub_category_id:this.subCategoryId,brand_id:this.brandId,权重:parseInt(this.product.weight),unit_weight:this.product.unitWeight ==='gram'?'g':'ml',体积: {长度:parseInt(this.product.volume.length),宽度:parseInt(this.product.volume.width),高度:parseInt(this.product.volume.height)}}formData.append('file',this.imageFile)formData.append('data',JSON.stringify(params))console.log(formData.getAll('data'))console.log(formData.getAll('file'))console.log('this.imagefile',this.imageFile)console.log('this.params',params)console.log('formData',formData)this.fullscreenLoading = true等待this.klikdailyAPI().post('products',formData).then(result => {让消息= this.product.name +'成功创建'this.$ store.commit('products/setMessage',消息)this.$ router.push('/products')this.fullscreenLoading =假}).catch(err => {this.snackbar = truethis.snackbarObject = {颜色:错误",文字:错误!'+ err.response.data.message}})} 

我的api方法:

  klikdailyAPI(){返回axios.create({baseURL:`$ {url}/api/v1/`,标头:{'授权':`Bearer $ {localStorage.getItem('tokenApi')}`,内容类型":多部分/表单数据"}})} 

我的代码有什么问题?

解决方案

  data = {'file':this.imagefile,'data':params}axios.post('/api',data,header).then(response => {console.log(response);}) 

I want send my data from vue to api. I don't know why my formData is empty. You can see snapshot attached. I've tried several hours using several links on stackoverflow this link and this link.

my confirm method:

async confirm () {
      let formData = new FormData()
      let params = {
        name: this.product.name,
        department_id: this.departmentId,
        category_id: this.categoryId,
        sub_category_id: this.subCategoryId,
        brand_id: this.brandId,
        weight: parseInt(this.product.weight),
        unit_weight: this.product.unitWeight === 'gram' ? 'g' : 'ml',
        volume: {
          length: parseInt(this.product.volume.length),
          width: parseInt(this.product.volume.width),
          height: parseInt(this.product.volume.height)
        }
      }
      formData.append('file', this.imageFile)
      formData.append('data', JSON.stringify(params))
      console.log(formData.getAll('data'))
      console.log(formData.getAll('file'))
      console.log('this.imagefile', this.imageFile)
      console.log('this.params', params)
      console.log('formData', formData)
      this.fullscreenLoading = true
      await this.klikdailyAPI().post('products', formData).then(result => {
        let message = this.product.name + ' succesfully created'
        this.$store.commit('products/setMessage', message)
        this.$router.push('/products')
        this.fullscreenLoading = false
      }).catch(err => {
        this.snackbar = true
        this.snackbarObject = {
          color: 'error',
          text: 'ERROR! ' + err.response.data.message
        }
      })
    }

my api method:

klikdailyAPI () {
      return axios.create({
        baseURL: `${url}/api/v1/`,
        headers: {
          'Authorization': `Bearer ${localStorage.getItem('tokenApi')}`,
          'Content-Type': 'multipart/form-data'
        }
      })
    }

What's wrong with my code?

解决方案

data = {'file': this.imagefile , 'data': params}

axios.post('/api', data, header).then( response => { console.log(response); } )

这篇关于FormData使用axios发送空数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆