微信小程序--注册时获取微信头像

news/2024/7/20 0:51:52 标签: 微信小程序, 微信, 小程序

参考官方文档:点击跳转

具体实现:

wxml:

<button class="avatarBtn" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
    <image class="avatar" :src="avatarUrl"></image>
</button>

js:

const defaultAvatarUrl =
'https://mmbiz.qpic.cn/mmbiz/icTdbqWNOwNRna42FI242Lcia07jQodd2FJGIYQfG0LAJGFxM4FbnQP6yfMxBgJ0F3YRqJCJ1aPAK2dQagdusBZg/0'
const avatarUrl = ref(defaultAvatarUrl)
//图片路径容器
const imgInfo = reactive({
		imgs: ''
	})

// 头像上传事件
	const onChooseAvatar = (e) => {
		console.log(e);
		avatarUrl.value = e.detail.avatarUrl;
		console.log(e.detail.avatarUrl);
		uni.uploadFile({
			url: 'https://xxxx', //仅为示例,非真实的接口地址
			filePath: e.detail.avatarUrl,
			name: 'file',
			formData: {
				'user': 'test'
			},
			success: function(res) {
                   //剥离接口返回路径
				imgInfo.imgs = JSON.parse(res.data)
				console.log(imgInfo.imgs.data.url);
			}
		});
	}

之后根据注册需求适当调整即可  (〃 ̄︶ ̄)人( ̄︶ ̄〃)


http://www.niftyadmin.cn/n/5411339.html

相关文章

3.5 力扣 交错字符串

97. 交错字符串 给定三个字符串 s1、s2、s3&#xff0c;请你帮忙验证 s3 是否是由 s1 和 s2 交错 组成的。 两个字符串 s 和 t 交错 的定义与过程如下&#xff0c;其中每个字符串都会被分割成若干 非空 子字符串&#xff1a; s s1 s2 ... snt t1 t2 ... tm|n - m| &…

LVS 负载均衡部署的三种模式 与搭建dr模式具体步骤

一 LVS 负载均衡部署的模式 LVS 有三种负载均衡的模式&#xff0c;分别是VS/NAT(nat 模式)、VS/DR(路由模式)、VS/TUN(隧道模式)。 &#xff08;一&#xff09;三种模式原理 及优缺点 1&#xff0c;nat 模式 1.1 原理 原理:首先负载均衡器接收到客户的请求数据包时&am…

Java实战:Spring Boot 异步线程间数据传递

本文将详细介绍如何在Spring Boot项目中实现异步线程间的数据传递&#xff0c;包括异步线程的基本概念、数据传递的方式、具体实现方式等。通过阅读本文&#xff0c;我们将了解到如何在Spring Boot中实现异步线程间的数据传递&#xff0c;并能够将这些知识应用到实际项目中。 …

【BUG】cmd运行wmic提示‘wmic‘ 不是内部或外部命令

cmd运行wmic提示‘wmic‘ 不是内部或外部命令 解决办法 将C:\Windows\System32\wbem添加到系统环境变量

【信息系统项目管理师】--【信息技术发展】--【新一代信息技术及应用】--【虚拟现实】

文章目录 第二章 信息技术发展2.2 新一代信息技术及应用2.2.6 虚拟现实1.技术基础2.关键技术3.应用和发展 第二章 信息技术发展 信息技术是在信息科学的基本原理和方法下&#xff0c;获取信息、处理信息、传输信息和使用信息的应用技术总称。从信息技术的发展过程来看&#xff…

bug_java

文章目录 1.创建Maven时&#xff1a; idea报错为&#xff1a;java&#xff1a;错误&#xff1a;不支持发行版本52. Springbot启动报错-类文件具有错误的版本 61.0, 应为 52.0 1.创建Maven时&#xff1a; idea报错为&#xff1a;java&#xff1a;错误&#xff1a;不支持发行版本…

flutter_gen依赖

flutter_gen 5.4.0 flutter项目内终端&#xff1a; dart pub global activate flutter_gen export PATH“ P A T H " : " PATH":" PATH":"HOME/.pub-cache/bin” fluttergen

鸿蒙Harmony应用开发—ArkTS声明式开发(事件独占控制)

设置组件是否独占事件&#xff0c;事件范围包括组件自带的事件和开发者自定义的点击、触摸、手势事件。 在一个窗口内&#xff0c;设置了独占控制的组件上的事件如果首先响应&#xff0c;则本次交互只允许此组件上设置的事件响应&#xff0c;窗口内其他组件上的事件不会响应。 …