VUE Form表单传参时,json格式转Form Data格式

最近做了一个项目,form表单传参,之前传参都是v-model双向绑定,然后在data里面定义,把绑定的属性名传过去就行啦,在做这个项目的时候,后台要求传递的参数是form data的形式,而不是json的形式,所以要把json的格式转换成form data的格式

下面来说下是如何转换的

我们在请求接口的时候需要传递参数,在传参数之前,直接把参数转换成form data的格式 然后直接传进去就行啦

const sele = this
var newFormData = new FormData()
      newFormData.append('card', self.retrieval.card)
      newFormData.append('company', self.retrieval.company)
      newFormData.append('companyType', self.retrieval.companyType)
      newFormData.append('dealStatus', self.retrieval.dealStatus ? self.retrieval.dealStatus : '')
      newFormData.append('department', self.retrieval.department)
      newFormData.append('email', self.retrieval.email ? self.retrieval.email : '')
      newFormData.append('followStatus', self.retrieval.followStatus)
      newFormData.append('mobile', self.retrieval.mobile)
      newFormData.append('position', self.retrieval.position)
      newFormData.append('realName', self.retrieval.realName)
      newFormData.append('remark', self.retrieval.remark ? self.retrieval.remark : '')
      newFormData.append('userId', self.retrieval.userId)
      newFormData.append('updateRealName', self.retrieval.updateRealName ? self.retrieval.updateRealName : '')
      newFormData.append('updateCompany', self.retrieval.updateCompany ? self.retrieval.updateCompany : '')
      newFormData.append('updateDepartment', self.retrieval.updateDepartment ? self.retrieval.updateDepartment : '')
      newFormData.append('updatePosition', self.retrieval.updatePosition ? self.retrieval.updatePosition : '')
      newFormData.append('userType', self.retrieval.userType)
      newFormData.append('updateEmail', self.retrieval.updateEmail ? self.retrieval.updateEmail : '')
      axios.post('/person/savePersonInfo', newFormData).then(res => {
        if (res.code === '0') {
          this.$message.success(res.msg)
        } else {
          this.$message.error(res.msg)
        }
        // this.keepLoading = false
      })

最后详细介绍

首先呢,为了不改变this的指向,我们先声明一个变量去接受他,然后用这个变量去代替我们的this,接着我们在请求接口的函数中,new一个FormData实例,然后在通过append()的方法,把参数追加到我们声明的变量中,把这个变量当做参数传就去就可以啦

在这里插入图片描述

最后的格式
在这里插入图片描述

Logo

前往低代码交流专区

更多推荐