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)
	}
  })
}
相关推荐
HF_code3 分钟前
uniapp-history路由深度指南
uni-app
BillKu19 分钟前
Element Plus 的 el-tab-pane:lazy 的说明
前端·javascript·vue.js
爱勇宝21 分钟前
《道德经》第 11 章:真正有用的,常常是你没写出来的那部分
前端·后端·产品
jearry24 分钟前
WebView2 原生拖放的桥接之道:拆解 yyzTools 的 drop-zone.js
前端·c++
一位正在转型AI全栈的前端工程师25 分钟前
AI 全栈学习之旅 -Week 11:从 CLI 到浏览器:用 FastAPI、SSE 和 Vue 3 做一个可审核的 ReAct Agent
前端·python
10share29 分钟前
我为什么用 React 重写了一个 VitePress
前端·react.js
计算机魔术师31 分钟前
GPT-6 Astra 发布后,Sebastian Raschka 解析 looped transformer 与隐藏推理链传闻
前端
不可能片场37 分钟前
Electron 退化成 node:一个环境变量的锅
前端·electron
楚楚河河39 分钟前
js 变量声明
前端
Cicada1281 小时前
Web 服务器怎么选
运维·服务器·前端