uniapp微信小程序投票系统实战 (SpringBoot2+vue3.2+element plus ) -用户信息修改实现

锋哥原创的uniapp微信小程序投票系统实战:

uniapp微信小程序投票系统实战课程 (SpringBoot2+vue3.2+element plus ) ( 火爆连载更新中... )_哔哩哔哩_bilibiliuniapp微信小程序投票系统实战课程 (SpringBoot2+vue3.2+element plus ) ( 火爆连载更新中... )共计21条视频,包括:uniapp微信小程序投票系统实战课程 (SpringBoot2+vue3.2+element plus ) ( 火爆连载更新中... )、第2讲 投票项目后端架构搭建、第3讲 小程序端 TabBar搭建等,UP主更多精彩视频,请关注UP账号。icon-default.png?t=N7T8https://www.bilibili.com/video/BV1ea4y137xf/后端修改用户昵称:

/*** 更新用户昵称* @param wxUserInfo* @param token* @return*/
@RequestMapping("/updateNickName")
public R updateNickName(@RequestBody WxUserInfo wxUserInfo,@RequestHeader String token){if(StringUtil.isNotEmpty(wxUserInfo.getNickName())) {Claims claims = JwtUtils.validateJWT(token).getClaims();wxUserInfoService.update(new UpdateWrapper<WxUserInfo>().eq("openid", claims.getId()).set("nick_name", wxUserInfo.getNickName()));}return R.ok();
}

前端修改用户昵称:

<input type="nickname"  placeholder="请输入昵称" v-model="userInfo.nickName" @blur="onChangeNickName"/>
onChangeNickName:async function(e){console.log(e.detail.value);let nickName=e.detail.value;if(!isEmpty(nickName)){const result=await requestUtil({url:"/user/updateNickName",data:{nickName:nickName},method:"post"});}}
export const isEmpty=(str)=>{if(str === '' || str.trim().length === 0 ){return true}else{return false;}
}

头像上传 后端:

定义上传路径:

userImagesFilePath: D://uniapp/userImgs/
@Value("${userImagesFilePath}")
private String userImagesFilePath;
/*** 上传用户头像图片* @param userImage* @return* @throws Exception*/
@RequestMapping("/uploadUserImage")
public Map<String,Object> uploadUserImage(MultipartFile userImage, @RequestHeader String token)throws Exception{System.out.println("filename:"+userImage.getName());Map<String,Object> resultMap=new HashMap<>();if(!userImage.isEmpty()){// 获取文件名String originalFilename = userImage.getOriginalFilename();String suffixName=originalFilename.substring(originalFilename.lastIndexOf("."));String newFileName= DateUtil.getCurrentDateStr()+suffixName;FileUtils.copyInputStreamToFile(userImage.getInputStream(),new File(userImagesFilePath+newFileName));resultMap.put("code",0);resultMap.put("msg","上传成功");resultMap.put("userImageFileName",newFileName);// 更新到数据库UpdateWrapper<WxUserInfo> updateWrapper=new UpdateWrapper<>();Claims claims = JwtUtils.validateJWT(token).getClaims();updateWrapper.eq("openid",claims.getId()).set("avatar_url",newFileName);wxUserInfoService.update(new UpdateWrapper<WxUserInfo>().eq("openid",claims.getId()).set("avatar_url",newFileName));}return resultMap;
}

前端头像实现:

button上加下 open-type="chooseAvatar"

		onChooseAvatar:function(e){console.log(e.detail.avatarUrl)uni.uploadFile({header:{token:uni.getStorageSync("token")},url:getBaseUrl()+"/user/uploadUserImage",filePath:e.detail.avatarUrl,name:"userImage",success: (res) => {let result=JSON.parse(res.data);if(result.code==0){this.userInfo.avatarUrl=result.userImageFileName;}}})},

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/234053.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

工业异常检测AnomalyGPT-Demo试跑

写在前面&#xff1a;如果你有大的cpu和gpu可以使用&#xff0c;直接根据官方的安装说明就可以&#xff0c;如果没有&#xff0c;可以点进来试着看一下我个人的安装经验。 一、试跑环境 NVIDIA4090显卡24g,cpu内存33G&#xff0c;交换空间8g,操作系统ubuntu22.04(试跑过程cpu…

【服务器数据恢复】Raid5热备盘同步失败导致lvm结构损坏的数据恢复案例

服务器数据恢复环境&#xff1a; 两组由4块磁盘组建的raid5磁盘阵列&#xff0c;两组raid5阵列划分为lun并组成了lvm结构&#xff0c;ext3文件系统。 服务器故障&#xff1a; 一组raid5阵列中的一块硬盘离线&#xff0c;热备盘自动上线并开始同步数据。在热备盘完成同步之前&am…

精进单元测试技能——Pytest断言的艺术

本篇文章主要是阐述Pytest在断言方面的应用。让大家能够了解和掌握Pytest针对断言设计了多种功能以适应在不同测试场景上使用。 了解断言的基础 在Pytest中&#xff0c;断言是通过 assert 语句来实现的。简单的断言通常用于验证预期值和实际值是否相等&#xff0c;例如&#xf…

vue3中路由的使用(详细讲解)

1、路由的简介 路由(route)&#xff1a;就是根据特定的规则将数据包或请求从源地址传输到目标地址的过程。 在前端或者vue3项目中路由主要用于构建单页面应用程序&#xff08;SPA&#xff09;&#xff0c;其中所有的页面都在同一个HTML文件中加载&#xff0c;通过JavaScript动…

前端八股文(网络篇)一

目录 1.Get和Post的请求的区别 2.常见的HTTP请求头和响应头 3.常见的HTTP请求方法 4.HTTP与HTTPS协议的区别 5.对keep-alive的理解 6.页面有多张图片&#xff0c;HTTP是怎样的加载表现&#xff1f; 7.HTTP请求报文是什么样的&#xff1f; 8.HTTP响应报文是什么样&#x…

为什么大型服务器要用 Linux 系统?

为什么大型服务器要用 Linux 系统&#xff1f; 在开始前我有一些资料&#xff0c;是我根据网友给的问题精心整理了一份「Linux的资料从专业入门到高级教程」&#xff0c; 点个关注在评论区回复“888”之后私信回复“888”&#xff0c;全部无偿共享给大家&#xff01;&#xff…

STM32 ESP8266 物联网智能温室大棚 (附源码 PCB 原理图 设计文档)

资料下载: https://download.csdn.net/download/vvoennvv/88680924 一、概述 本系统以STM32F103C8T6单片机为主控芯片&#xff0c;采用相关传感器构建系统硬件电路。其中使用DHT11温湿度传感器对温度和湿度的采集&#xff0c;MQ-7一氧化碳传感器检测CO浓度&#xff0c;GP2Y101…

[足式机器人]Part3 机构运动学与动力学分析与建模 Ch00-1 坐标系与概念基准

本文仅供学习使用&#xff0c;总结很多本现有讲述运动学或动力学书籍后的总结&#xff0c;从矢量的角度进行分析&#xff0c;方法比较传统&#xff0c;但更易理解&#xff0c;并且现有的看似抽象方法&#xff0c;两者本质上并无不同。 2024年底本人学位论文发表后方可摘抄 若有…

Python进阶之元类

Python进阶之元类 目录 什么是元类&#xff1f; 元类的调用流程 根据类自定义元类 __new__方法以及参数 ----------cls ----------name ----------bases ----------attrs __call__方法 生成对象的完整代码 什么是元类&#xff1f; 在python面向对象中&#xff0c;我们知道所有…

使用串口 DMA 模式接收不定长数据

一、简介 曾经遇到客户有一个需求&#xff0c;需要用串口 DMA 的方式接收不定长度的数据&#xff0c;DMA 有个缺点就是在每次传输前需要设定好传输的字节长度&#xff0c;这种方式显然对于接收不定长度的数据来说没有那么灵活。但 DMA 也有着显著的优点&#xff0c;如可直接访…

网络安全—部署CA证书服务器

文章目录 网络拓扑安装步骤安装证书系统安装从属证书服务器 申请与颁发申请证书CA颁发证书 使用windows Server 2003环境 网络拓扑 两台服务器在同一网段即可&#xff0c;即能够互相ping通。 安装步骤 安装证书系统 首先我们对计算机名进行确认&#xff0c;安装了证书系统后我…

(vue)el-cascader级联选择器实现单/多选最后一级并回显

(vue)el-cascader实现多选最后一级并回显 <el-form-item label"选择算法模型&#xff1a;"><el-cascaderv-model"formInline.algorithmId":options"modelOptions":props"{ value: id, label: name, multiple: true, emitPath: fal…

002集filter()函数及lambda()函数应用实例—python基础入门实例

1.filter()函数的基本语法如下&#xff1a; filter ( function , iterable ) 其中&#xff0c;function是一个用于判断的函数&#xff0c;iterable是一个可迭代对象&#xff0c;可以是列表、元组、集合或字符串等。filter()会将iterable中的每个元素依次传给function进行判…

python编程使用selenium模拟登陆淘宝实例代码

selenium简介 selenium 是一个web的自动化测试工具&#xff0c;不少学习功能自动化的同学开始首选selenium &#xff0c;相因为它相比QTP有诸多有点&#xff1a; * 免费&#xff0c;也不用再为破解QTP而大伤脑筋* 小巧&#xff0c;对于不同的语言它只是一个包而已&#xff0c…

【win11 绕过TPM CPU硬件限制安装】

Qt编程指南 VX&#xff1a;hao541022348 ■ 下载iso文件■ 右键文件点击装载出现如下问题■ 绕过TPM CPU硬件限制安装方法■ 虚拟机安装win11 ■ 下载iso文件 选择Windows11 &#xff08;multi-edition ISO&#xff09;在选择中文 ■ 右键文件点击装载出现如下问题 ■ 绕过T…

LINE网页版使用方法(内含LINE网页版特点总结)

如果想要在电脑上使用LINE&#xff0c;但是又觉得下载客户端很累赘的话&#xff0c;LINE网页版是你最好的选择。但是LINE网页版相对于其他平台来说使用方式比较少。所以今天就来讲讲&#xff0c;我们有什么方式可以在电脑中使用LINE。 LINE网页版使用方法 1.需要使用Chrome浏览…

作业--day42

界面设计 MyProWin::MyProWin(QWidget *parent): QMainWindow(parent) {/**********窗口主体**********///窗口大小this->setFixedSize(644, 493);this->setWindowTitle("QQ");this->setWindowIcon(QIcon("C:/Users/10988/Downloads/pictrue/pictrue/…

java编程中,保证接口幂等性的实现方案讨论

一、什么是幂等性 数学中的幂等是指f(x) f(f(x))&#xff0c;编程领域的术语是指同一个操作&#xff0c;在重复提交的情况下&#xff0c;最终产生的影响是不变的。举例说&#xff1a; 提交订单时&#xff0c;用户在购物车界面&#xff0c;重复点击“下单”&#xff0c;服务端…

摆动排序 II

题目链接 摆动排序 II 题目描述 注意点 将数组重新排列成 nums[0] < nums[1] > nums[2] < nums[3]… 的顺序题目数据保证&#xff0c;对于给定的输入 nums &#xff0c;总能产生满足题目要求的结果用 O(n) 时间复杂度和 / 或原地 O(1) 额外空间来实现 解答思路 如…

学习笔记16——操作系统

学习笔记系列开头惯例发布一些寻亲消息&#xff0c;感谢关注&#xff01; 链接&#xff1a;https://www.mca.gov.cn/lljz/indexdetail.html?idd0afa7f6f36946319a206d61937f9b63&type0&t10.11199120579373845 八股——操作系统一些基础知识整理 一个java程序对应一个…