uniapp 使用 uni-file-picker 上传头像

此处使用 @select 处理选择完文件后的逻辑,即将文件上传到自己的服务器。

html 复制代码
<uni-file-picker limit="1" :del-icon="false" disable-preview :imageStyles="imageStyles"
					file-mediatype="image" @select="upload">选择</uni-file-picker>

此处我需要将头像的存储地址存入数据库中,因此需要上传额外的参数(用户的id),所以需要使用 uni.uploadFile() 的 formData。

javascript 复制代码
/* 头像上传 */
upload(e) {
  console.log(e)
  uni.uploadFile({
	url: 'http://localhost:8887/uploadAvatar',
	filePath: e.tempFilePaths[0],
	name: 'file',
	formData: {
	  sid: this.student.sid
	},
	header: {
	  'content-type': 'multipart/form-data' // 使用multipart/form-data格式
	},
	success: (res) => {
	  console.log(res)
	}
  })
}
相关推荐
曹牧21 分钟前
C#:记录日志
服务器·前端·c#
小飞侠在吗24 分钟前
Vue customRef
前端·javascript·vue.js
xhxxx43 分钟前
别再让 AI 自由发挥了!用 LangChain + Zod 强制它输出合法 JSON
前端·langchain·llm
指尖跳动的光1 小时前
判断页签是否为活跃状态
前端·javascript·vue.js
用泥种荷花1 小时前
【前端学习AI】大模型调用实战
前端
Lan.W1 小时前
element UI + vue2 + html实现堆叠条形图 - 横向分段器
前端·ui·html
FAQEW1 小时前
若依(RuoYi-Vue)单体架构实战手册:自定义业务模块全流程开发指南
前端·后端·架构·若依二开
神算大模型APi--天枢6462 小时前
合规与高效兼得:国产全栈架构赋能行业大模型定制,从教育到工业的轻量化落地
大数据·前端·人工智能·架构·硬件架构
千寻girling2 小时前
马上元旦节了,手写一个《前端脚手架》庆祝一下 !
前端
嚣张丶小麦兜2 小时前
认识vite
前端·javascript·vue.js