微信小程序之button组件--wx.login()

微信小程序之button组件

'''
推荐使用button组件获取授权微信用户的信息

点击按钮事件自动触发获取wx.getUserInfo
'''

1. // pages/login/login.wxml

<view>
	<button class="submit" open-type="getUserInfo" bindgetuserinfo="onClickSubmit">登录 | 注册</button>
</view>

2. // pages/login/login.js ---wx.login()

onClickSubmit: function(e) {
	//wx.login用于给当前用户获取一个登录凭证（有效期五分钟），即：response.code
	//点击按钮事件自动触发获取wx.getUserInfo，参数e.detail.userInfo,获取微信用户信息。
	wx.login({
	  success: (response) => {
		wx.request({
		  url: api.Login,
		  data: {
			phone: this.data.phone,
			code: this.data.code,
			nickname: e.detail.userInfo.nickName,
			avatar: e.detail.userInfo.avatarUrl,
			wx_code: response.code
		  },
		  method: 'POST',
		  success: function(res) {
			if (res.data.status) {
			  app.initUserInfo(res.data.data, e.detail.userInfo);
			  wx.navigateBack();
			} else {
			  wx.showToast({
				title: res.data.message,
				icon: 'none'
			  })
			}
		  }
		})
	  }
	})
  },

3. //app.js -----app.initUserInfo()，登录信息初始化，并缓冲到本地

App({
  onLaunch: function() {
	var userInfo = wx.getStorageSync('userInfo');
	if (userInfo) {
	  this.globalData.userInfo = userInfo;
	}
  },
  globalData: {
	userInfo: null
  },
  initUserInfo: function(tokenInfo, userInfo) {
	var info = {
	  nickName: userInfo.nickName,
	  avatarUrl: userInfo.avatarUrl,
	  token: tokenInfo.token,
	  phone: tokenInfo.phone
	};
	this.globalData.userInfo = info
	wx.setStorageSync('userInfo', info);
  },
  logoutUserInfo:function(){
	wx.removeStorageSync('userInfo');
	this.globalData.userInfo=null;
  }
})