微信小程序制作——获取用户信息
1.获取用户信息
方式一
-
wxml
<view bindtap="getUserName">获取当前用户名</view>
-
js
getUserName:function(){ // 调用微信提供的接口获取用户信息 wx.getUserInfo({ success: function (res) { // 调用成功后触发 console.log('success',res) }, fail:function(res){ // 调用失败后触发 console.log('fail', res) } }) },
方法二
-
wxml
<button open-type="getUserInfo" bindgetuserinfo="xxxx">授权登录</button>
-
js
xxxx:function(){ wx.getUserInfo({ success: function (res) { // 调用成功后触发 console.log('success', res) }, fail: function (res) { // 调用失败后触发 console.log('fail', res) } }) }
示例
-
wxml
<!--pages/login/login.wxml--> <view>当前用户名:{{name}}</view> <view> 当前头像:<image src="{{path}}" style="height:200rpx;width:200rpx;"></image> </view> <button open-type="getUserInfo" bindgetuserinfo="fetchInfo">获取信息button</button>
-
js
// pages/login/login.js Page({ /** * 页面的初始数据 */ data: { name:"", path: "/static/default.png" }, fetchInfo:function(){ var that = this; wx.getUserInfo({ success:function(res){ console.log(res); that.setData({ name:res.userInfo.nickName, path:res.userInfo.avatarUrl }) } }) }, /** * 生命周期函数--监听页面加载 */ onLoad: function (options) { }, /** * 生命周期函数--监听页面初次渲染完成 */ onReady: function () { }, /** * 生命周期函数--监听页面显示 */ onShow: function () { }, /** * 生命周期函数--监听页面隐藏 */ onHide: function () { }, /** * 生命周期函数--监听页面卸载 */ onUnload: function () { }, /** * 页面相关事件处理函数--监听用户下拉动作 */ onPullDownRefresh: function () { }, /** * 页面上拉触底事件的处理函数 */ onReachBottom: function () { }, /** * 用户点击右上角分享 */ onShareAppMessage: function () { } })
注意事项:
-
想要获取用户信息,必须经过用户授权(button)。
-
已授权
-
不授权,通过调用wx.openSetting
// 打开配置,手动授权。 // wx.openSetting({})
-
4.获取用户位置信息
-
wxml
<view bindtap="getLocalPath">{{localPath}}</view>
-
js
data: { localPath:"自己想要选择的位置", }, getLocalPath:function(){ var that = this; wx.chooseLocation({ success: function(res) { that.setData({localPath:res.address}); }, }) },