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


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 相关文章推荐
jQuery EasyUI API 中文文档 - Pagination分页
Sep 29 Javascript
Javascript 浮点运算的问题分析与解决方法
Aug 27 Javascript
jQuery实现级联菜单效果(仿淘宝首页菜单动画)
Apr 10 Javascript
js中 javascript:void(0) 用法详解
Aug 11 Javascript
举例讲解JavaScript substring()的使用方法
Nov 09 Javascript
apply和call方法定义及apply和call方法的区别
Nov 15 Javascript
js实现键盘自动打字效果
Dec 23 Javascript
vue实现ajax滚动下拉加载,同时具有loading效果(推荐)
Jan 11 Javascript
JavaScript数据结构之链表的实现
Mar 19 Javascript
Angular使用Restful的增删改
Dec 28 Javascript
JS使用正则表达式提交页面验证的代码
Oct 16 Javascript
原生JavaScript之es6中Class的用法分析
Feb 23 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
重置版战役片段
2020/04/09 魔兽争霸
PHP调用三种数据库的方法(1)
2006/10/09 PHP
中国站长站 For Dede4.0 采集规则
2007/05/27 PHP
PHP json格式和js json格式 js跨域调用实现代码
2012/09/08 PHP
PHP操作MySQL事务实例
2014/11/05 PHP
docker-compose部署php项目实例详解
2019/07/30 PHP
jquery 常用操作整理 基础入门篇
2009/10/14 Javascript
JavaScript 判断判断某个对象是Object还是一个Array
2010/01/28 Javascript
妙用Jquery的val()方法
2012/06/27 Javascript
Nodejs进程管理模块forever详解
2014/06/01 NodeJs
js和jquery设置disabled属性为true使按钮失效
2014/08/07 Javascript
Javascript 拖拽雏形中的一些问题(逐行分析代码,让你轻松了拖拽的原理)
2015/01/23 Javascript
jQuery实现径向动画菜单效果
2015/07/17 Javascript
jQuery+html5+css3实现圆角无刷新表单带输入验证功能代码
2015/08/21 Javascript
JS表格组件神器bootstrap table详解(基础版)
2015/12/08 Javascript
对js中回调函数的一些看法
2016/08/29 Javascript
ES6新特性一: let和const命令详解
2017/04/20 Javascript
input 标签实现输入框带提示文字效果(两种方法)
2017/10/09 Javascript
vue打包后显示空白正确处理方法
2017/11/01 Javascript
微信小程序button组件使用详解
2018/01/31 Javascript
vue-router判断页面未登录自动跳转到登录页的方法示例
2018/11/04 Javascript
Python正则简单实例分析
2017/03/21 Python
python pandas写入excel文件的方法示例
2019/06/25 Python
使用python的pandas为你的股票绘制趋势图
2019/06/26 Python
python集合删除多种方法详解
2020/02/10 Python
ubuntu 安装pyqt5和卸载pyQt5的方法
2020/03/24 Python
利用Python将多张图片合成视频的实现
2020/11/23 Python
百度软件工程师职位
2013/02/14 面试题
棉花姑娘教学反思
2014/02/15 职场文书
《一件运动衫》教学反思
2014/02/19 职场文书
入党自荐书范文
2014/03/09 职场文书
2014年领导班子专项整治整改方案
2014/09/28 职场文书
文明单位汇报材料
2014/12/24 职场文书
医生个人年终总结
2015/02/28 职场文书
公司车辆维修管理制度
2015/08/05 职场文书
Go语言基础map用法及示例详解
2021/11/17 Golang