微信小程序获取 用户昵称和头像
使用uni-app vue3 写法如下
html
<template>
<!-- 点击获取--头像 -->
<view class="avatar">
<button open-type="chooseAvatar" class="avatarButton" @chooseavatar="getavatar">
<image class="picture" :src="headerAvatar ? headerAvatar : ' ../../../static/login/logo.png'" mode=""></image>
</button>
</view>
<!-- 点击获取--昵称 -->
<view class="nick_name">
<text class="infoName">用户昵称: </text>
<input type="nickname" class="infoNickName" v-model="getName" placeholder="请输入名字" @change="getname" />
</view>
</template>
javascript
<script setup>
const getavatar = (e) => {
console.log('-e---', e);
headerAvatar.value = e.detail.avatarUrl;
uni.setStorageSync('avatar', e.detail.avatarUrl);
};
const getname = (e) => {
console.log('获取昵称', e);
getName.value = e.detail.value;
uni.setStorageSync('nickname', e.detail.value);
};
</script>
运行效果如下