uniapp 小程序,登录上传头像昵称页面处理步骤

登录上传头像 成功前阻塞 处理成功后才跳转回 游戏页面 为了能看见最新上传的头像显示,处理方式是 重新封装base64处理方法为promise 这样可以用await等待,请求后台的方法也等待,等待处理完成后调用跳转页面方法,同时信息上传完成后要跳转的页面的初始钩子事件由onload改为onshow,这个钩子中包含获取缓存中useinfo的处理, 这样每次出来再切换进来都会重新获取新的用户信息。ps 保存请求回来的用户信息并放入缓存是 登录方法login中封装好的

javascript 复制代码
	// 重新封装base64处理方法为promise 这样可以用await等待
	const readFileAsync = (filePath) => {
	  return new Promise((resolve, reject) => {
	    uni.getFileSystemManager().readFile({
	      filePath,
	      encoding: 'base64',
	      success: (res) => resolve(res),
	      fail: (err) => reject(err)
	    });
	  });
	};
	const upLoad = async (isSuccessClose) => {
		const r = await readFileAsync(avatarUrl.value, 'base64');
		console.log('base64转换完成的结果',r.data);
		const avatarUrl_base64 = 'data:image/jpeg;base64,' + r.data
		console.log('avatarUrl_base64 转换完成 ', avatarUrl_base64)
		const res = await myUtils.requestAwait('user/updateUserDetail', {
			nickName: nickName.value,
			avatarUrl: avatarUrl_base64,
			openid: userInfo.value.openid
		})
		if(!isSuccessClose){
			return
		}
		
		console.log('头像上传完成 ', res)
		uni.showToast({
			title: '保存成功',
			icon: 'none', //success 等
			duration: 1000
		});
		console.log('头像后登录')
		const lr =await myUtils.login()
		console.log('登录完成后跳转')
		to1Tab('grid')
		console.log('登录完成跳转完成')
		console.log(' 后加的上传结果恢复  ',res)
		
	}

成功后跳转的页面处理

javascript 复制代码
	onShow(()=>{	
		makeValArr()
		userInfo.value = uni.getStorageSync('userInfo');
		console.log('新 获取完成112 ', userInfo.value.avatarUrl)
	})
相关推荐
Ai-_Man5 小时前
您您这可以把Grok的多个会话比如说。左侧的多个会话一次性导出吗?不是单条会话里面的多次会对话。AI导出鸭
javascript·人工智能·ai·小程序·电脑
光影少年8 小时前
Taro 是如何解析入口配置 app.config.ts 和页面配置的?
微信小程序·小程序·typescript·reactjs·百度小程序·taro
DS小龙哥13 小时前
从呼吸心率到离床报警:60G雷达睡眠仪全栈开发实录(硬件+MQTT+小程序)DIY一台全功能睡眠监护仪
stm32·单片机·嵌入式硬件·物联网·小程序·智能家居
扶风ff15 小时前
练题簿在线免费刷题:刷题、背题、错题复习,一个小程序安排日常备考
学习·小程序
扶风ff15 小时前
练题簿在线免费刷题:共享题库、学习任务、在线考试,岗位培训更方便
学习·小程序
愚公搬代码17 小时前
【愚公系列】《微信小程序项目实战(AI编程+视频图解)》014-莫凡商城小程序项目视图容器组件的应用
微信小程序·小程序·ai编程
郑州光合科技余经理1 天前
海外版外卖加盟:总站与分站配送规则怎么分开管
java·开发语言·前端·后端·uni-app·php·ai编程
程xu袁1 天前
只有一段副歌,AI写歌选小程序、Suno还是海绵音乐?
小程序·suno·ai音乐·ai音乐工具·ai生成音乐·ai写歌工具
专业程序开发源2 天前
springboot生命故事书制作小程序65290-计算机课程设计、毕业设计
java·vue.js·spring boot·后端·mysql·小程序·课程设计
QQ_21696290962 天前
基于微信小程序的智能膳食分析系统
java·大数据·spring boot·微信小程序·小程序·旅游