微信小程序如何获取用户头像和昵称


Posted in Javascript onSeptember 23, 2019

本文介绍了微信小程序如何获取用户头像和昵称,分享给大家,具体如下:

微信小程序如何获取用户头像和昵称

代码user.wxml:

<view >
<view>
 <image class="avatar" src='{{userInfo.avatarUrl}}'></image>
 <view class="nickname">{{userInfo.nickName}}</view>
</view>
</view>

user.js

//sort.js
//?取????例
var app = getApp
Page({
 
 /**
  * 页面的初始数据
  */
 data: {
  //用户个人信息
  userInfo:{
   avatarUrl:"",//用户头像
   nickName:"",//用户昵称
  }
 },
 /**
  *点击添加地址事件
  */
 add_address_fun:function(){
  wx.navigateTo({
   url: 'add_address/add_address',
  })
 },
 
 /**
  * 生命周期函数--监听页面加载
  */
 onLoad: function (options) {
  var that=this;
  /**
   * 获取用户信息
   */
  wx.getUserInfo({
   success:function(res){
    console.log(res);
    var avatarUrl = 'userInfo.avatarUrl';
    var nickName = 'userInfo.nickName';
    that.setData({
     [avatarUrl]: res.userInfo.avatarUrl,
     [nickName]:res.userInfo.nickName,
    })
   }
  })
 },
 
 /**
  * 生命周期函数--监听页面初次渲染完成
  */
 onReady: function () {
 
 },
 
 /**
  * 生命周期函数--监听页面显示
  */
 onShow: function () {
 
 },
 
 /**
  * 生命周期函数--监听页面隐藏
  */
 onHide: function () {
 
 },
 
 /**
  * 生命周期函数--监听页面卸载
  */
 onUnload: function () {
 
 },
 
 /**
  * 页面相关事件处理函数--监听用户下拉动作
  */
 onPullDownRefresh: function () {
 
 },
 
 /**
  * 页面上拉触底事件的处理函数
  */
 onReachBottom: function () {
 
 },
 
 /**
  * 用户点击右上角分享
  */
 onShareAppMessage: function () {
 
 }
})

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js自带函数备忘 数组
Dec 29 Javascript
单击按钮显示隐藏子菜单经典案例
Jan 04 Javascript
javascript自然分类法算法实现代码
Oct 11 Javascript
JavaScript实现同步于本地时间的动态时间显示方法
Feb 02 Javascript
基于javascript实现的快速排序
Dec 02 Javascript
js 数据存储和DOM编程
Feb 09 Javascript
js仿新浪微博消息发布功能
Feb 17 Javascript
详解vue 实例方法和数据
Oct 23 Javascript
js实现登录与注册界面
Nov 01 Javascript
AngularJS下$http服务Post方法传递json参数的实例
Mar 29 Javascript
javascript关于“时间”的一次探索
Jul 24 Javascript
20多个小事例带你重温ES10新特性(小结)
Sep 29 Javascript
微信小程序使用蓝牙小插件
Sep 23 #Javascript
微信小程序实现蓝牙打印
Sep 23 #Javascript
微信接入之获取用户头像的方法步骤
Sep 23 #Javascript
从零搭一个自用的前端脚手架的方法步骤
Sep 23 #Javascript
layui 实现加载动画以及非真实加载进度的方法
Sep 23 #Javascript
layui加载数据显示loading加载完成loading消失的实例代码
Sep 23 #Javascript
ES10的13个新特性示例(小结)
Sep 23 #Javascript
You might like
新闻分类录入、显示系统
2006/10/09 PHP
PHP自动选择 连接本地还是远程数据库
2010/12/02 PHP
php中heredoc与nowdoc介绍
2014/12/25 PHP
jquery中dom操作和事件的实例学习-表单验证
2011/11/30 Javascript
E3 tree 1.6在Firefox下显示问题的修复方法
2013/01/30 Javascript
jQuery+CSS实现菜单滑动伸展收缩(仿淘宝)
2013/03/22 Javascript
JavaScript中的Math 使用介绍
2014/04/21 Javascript
javascript数组排序汇总
2015/07/07 Javascript
jQuery无缝轮播图代码
2016/12/22 Javascript
js模糊查询实例分享
2016/12/26 Javascript
原生js轮播(仿慕课网)
2017/02/15 Javascript
vue.js单页面应用实例的简单实现
2017/04/10 Javascript
手把手搭建安装基于windows的Vue.js运行环境
2017/06/12 Javascript
详解vue-cli构建项目反向代理配置
2017/09/07 Javascript
Angular实现双向折叠列表组件的示例代码
2017/11/21 Javascript
js 计算图片内点个数的示例代码
2019/04/04 Javascript
python正则表达式之作业计算器
2016/03/18 Python
Python错误提示:[Errno 24] Too many open files的分析与解决
2017/02/16 Python
Python函数装饰器实现方法详解
2018/12/22 Python
解决python中使用PYQT时中文乱码问题
2019/06/17 Python
美国户外生活方式品牌:Eddie Bauer
2016/12/28 全球购物
美国专营婴幼儿用品的购物网站:buybuy BABY
2017/01/01 全球购物
YesBabyOnline美国:全球性的在线婚纱礼服工厂
2018/05/05 全球购物
亚马逊墨西哥站:Amazon.com.mx
2018/08/26 全球购物
eBay爱尔兰站:eBay.ie
2019/08/09 全球购物
FC-Moto英国:欧洲最大的摩托车服装和头盔商店之一
2019/08/25 全球购物
应届毕业生个人自我评价
2013/09/20 职场文书
保安员岗位职责
2013/11/17 职场文书
企业车辆管理制度
2014/01/24 职场文书
物流业务员岗位职责
2014/02/08 职场文书
渡河少年教学反思
2014/02/12 职场文书
《赵州桥》教学反思
2014/02/17 职场文书
通报表扬范文
2015/01/17 职场文书
六一活动主持词
2015/06/30 职场文书
2015年小学生国庆节演讲稿
2015/07/30 职场文书
Python爬取某拍短视频
2021/06/11 Python