uniapp发送formdata表单请求(全网最简单方法)

因为uniapp不支持直接传输formdata,只提供了uploadFile方法上传文件,但是利用该方法就可以传输formdata了。

第一种:

可以直接使用filePath属性进行空文件传输,只需要设置filePath为空就行了。

function $uploadForm(url, data, filePath=''){
	return new Promise((resolve, reject) => {
		uni.uploadFile({
			header: {
				"Authorization": $getToken()
			},
			url: url,
			timeout: 1000*6,
			filePath,
			formData: data,
			success: (res) => {
			},
			complete: () => {
			},
			fail: (res) => {
			}
		})
	})
}

调用时,data是个对象即可。

this.$uploadForm(`/xxx`,{xxx:xxx}).then(res=>{})

第二种

使用file属性,无需选择文件,我们自己new个文件即可。

1、封装的上传方法

function $uploadFile(url, file, fileName='file', data){
	return new Promise((resolve, reject) => {
		uni.uploadFile({
			header: {
			},
			url: url,
			timeout: 1000*6,
			file: file,
			name: fileName,
			formData: data,
			success: (res) => {
			},
			complete: () => {
			},
			fail: (res) => {
			}
		})
	})
}

2、提交formdata

this.$uploadFile(this.testForm.url
					,new window.File([new Blob()],'a.txt')
					,'file'
					, JSON.parse(this.testForm.data)).then(res=>{})

测试结果在这里插入图片描述

结尾

通过以上两种方式就能使用uniapp以表单方式提交数据了,虽然多传个file,但是这并不影响接口业务。

  • 2
    点赞
  • 13
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Uni-app中使用FormData对象发送表单数据,可以按照以下步骤进行操作: 1. 在页面中创建一个表单,包含需要提交的表单字段。例如: ```html <template> <form @submit="submitForm"> <input type="text" v-model="name" placeholder="Name"> <input type="email" v-model="email" placeholder="Email"> <button type="submit">Submit</button> </form> </template> <script> export default { data() { return { name: '', email: '' }; }, methods: { submitForm() { // 创建一个FormData对象 const formData = new FormData(); // 将表单字段添加到FormData对象中 formData.append('name', this.name); formData.append('email', this.email); // 在这里可以使用uni.request或其他网络请求方法发送FormData数据 // 例如:uni.request({url, method, data: formData}) // 清空表单字段 this.name = ''; this.email = ''; } } } </script> ``` 2. 在`submitForm`方法中,创建一个FormData对象,并使用`append`方法表单字段添加到FormData对象中。 3. 使用uni.request或其他网络请求方法发送FormData对象。例如,你可以使用uni.request发送POST请求: ```javascript uni.request({ url: 'http://example.com/submit', method: 'POST', data: formData, success: (res) => { console.log(res); }, fail: (err) => { console.error(err); } }); ``` 在上述示例中,我们创建了一个FormData对象,并将表单字段`name`和`email`添加到其中。然后,我们使用uni.request方法发送POST请求,将FormData对象作为请求的数据部分。成功时,我们在控制台打印响应结果;失败时,打印错误信息。 请根据你的实际需求进行适当的调整和修改。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值