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


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 相关文章推荐
JavaScript Object的extend是一个常用的功能
Dec 02 Javascript
整理一些JavaScript的IE和火狐的兼容性注意事项
Mar 17 Javascript
jQuery判断元素是否是隐藏的代码
Apr 24 Javascript
JavaScript初学者建议:不要去管浏览器兼容
Feb 04 Javascript
jQuery.lazyload+masonry改良图片瀑布流代码
Jun 20 Javascript
jquery实现显示已选用户
Jul 21 Javascript
JQuery解析XML的方法小结
Apr 02 Javascript
jQuery原理系列-css选择器的简单实现
Jun 07 Javascript
深入理解Node中的buffer模块
Jun 03 Javascript
javascript 面向对象实战思想分享
Sep 07 Javascript
Vue-Router2.X多种路由实现方式总结
Feb 09 Javascript
vue+express 构建后台管理系统的示例代码
Jul 19 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
无线电波是什么?它是怎样传输的?
2021/03/01 无线电
PHP+mysql防止SQL注入的方法小结
2019/04/27 PHP
Yii 框架使用Forms操作详解
2020/05/18 PHP
jQuery数据显示插件整合实现代码
2011/10/24 Javascript
远离JS灾难css灾难之 js私有函数和css选择器作为容器
2011/12/11 Javascript
js随机颜色代码的多种实现方式
2013/04/23 Javascript
javascript从右边截取指定字符串的三种实现方法
2013/11/29 Javascript
基于Jquery和CSS3制作数字时钟附源码下载(CSS3篇)
2015/11/24 Javascript
全面解析JavaScript中apply和call以及bind(推荐)
2016/06/15 Javascript
Node.js connect ECONNREFUSED错误解决办法
2016/09/15 Javascript
利用BootStrap弹出二级对话框的简单实现方法
2016/09/21 Javascript
Vue.js学习之过滤器详解
2017/01/22 Javascript
简单实现js无缝滚动效果
2017/02/05 Javascript
Vue render深入开发讲解
2018/04/13 Javascript
Vue触发隐藏input file的方法实例详解
2019/08/14 Javascript
基于node+vue实现简单的WebSocket聊天功能
2020/02/01 Javascript
python 判断自定义对象类型
2009/03/21 Python
Python continue语句用法实例
2014/03/11 Python
Windows下实现Python2和Python3两个版共存的方法
2015/06/12 Python
利用Python脚本生成sitemap.xml的实现方法
2017/01/31 Python
Python3实现发送QQ邮件功能(文本)
2017/12/15 Python
浅谈Python NLP入门教程
2017/12/25 Python
Python中列表与元组的乘法操作示例
2018/02/10 Python
tensorflow saver 保存和恢复指定 tensor的实例讲解
2018/07/26 Python
win10下tensorflow和matplotlib安装教程
2018/09/19 Python
对python PLT中的image和skimage处理图片方法详解
2019/01/10 Python
Python实现带下标索引的遍历操作示例
2019/05/30 Python
Python爬虫实现模拟点击动态页面
2020/03/05 Python
Keras 加载已经训练好的模型进行预测操作
2020/06/17 Python
英国的知名精品百货公司:House of Fraser(福来德)
2016/08/14 全球购物
爱奇艺VIP会员:大剧抢先看
2018/07/11 全球购物
建筑实习自我鉴定
2013/10/18 职场文书
自我评价是什么
2014/01/04 职场文书
九年级体育教学反思
2014/01/23 职场文书
马智宇结婚主持词
2014/04/01 职场文书
银行文明优质服务培训心得体会
2016/01/09 职场文书