我们进入一个小程序,首先会请求获取用户昵称及头像,从“首页”获取的资料要传值到“我的”这个页面里面
我开始做的时候,在“我的”这个页面获取到的用户信息可以传值给“首页”,但是“首页”获取到的资料无法传给“我的”,
费劲一番周折(原谅我太笨),解决了,代码如下:
index页面即首页:
wxml代码:
<view>
<view wx:if="{{!hasUserInfo && canIUse}}" class="modal-mask" catchtouchmove="preventTouchMove"></view>
<button wx:if="{{!hasUserInfo && canIUse}}" class="modal-dialog" open-type="getUserInfo" bindgetuserinfo="getUserInfo"> 一键登录 </button>
<block>
<image src="{{userInfo.avatarUrl}}" mode="cover" bindtap='headImage'></image>
<text>{{userInfo.nickName}}</text>
</block>
</view>
js代码:
//获取应用实例
const app = getApp()
Page({
data: {
userInfo: {},
hasUserInfo: false,
canIUse: wx.canIUse('button.open-type.getUserInfo')
},
onShow: function () {
if (app.globalData.userInfo) {
this.setData({
userInfo: app.globalData.userInfo,
hasUserInfo: true
})
} else if (this.data.canIUse) {
// 由于 getUserInfo 是网络请求,可能会在 Page.onLoad 之后才返回
// 所以此处加入 callback 以防止这种情况
app.userInfoReadyCallback = res => {
this.setData({
userInfo: res.userInfo,
hasUserInfo: true
})
}
} else {
// 在没有 open-type=getUserInfo 版本的兼容处理
wx.getUserInfo({
success: res => {
app.globalData.userInfo = res.userInfo
this.setData({
userInfo: res.userInfo,
hasUserInfo: true
})
}
})
}
},
getUserInfo: function (e) {
wx.setStorageSync('userInfo', e.detail.userInfo);
app.globalData.userInfo = e.detail.userInfo
console.log(app.globalData.userInfo)
this.setData({
userInfo: e.detail.userInfo,
hasUserInfo: true
})
},
bindViewTap: function () {
this.setData({
hasUserInfo: false
})
},
})
mine页面即我的:
wxml代码:
<view>
<view wx:if="{{!hasUserInfo && canIUse}}" class="modal-mask" catchtouchmove="preventTouchMove"></view>
<button wx:if="{{!hasUserInfo && canIUse}}" class="modal-dialog" open-type="getUserInfo" bindgetuserinfo="getUserInfo"> 一键登录 </button>
<block>
<image src="{{userInfo.avatarUrl}}" mode="cover" bindtap='headImage'></image>
<text>{{userInfo.nickName}}</text>
</block>
</view>
js代码:
const app = getApp()
Page({
data: {
userInfo: {},
hasUserInfo: false,
canIUse: wx.canIUse('button.open-type.getUserInfo')
},
onShow: function () {
if (app.globalData.userInfo) {
this.setData({
userInfo: app.globalData.userInfo,
hasUserInfo: true
})
} else if (this.data.canIUse) {
// 由于 getUserInfo 是网络请求,可能会在 Page.onLoad 之后才返回
// 所以此处加入 callback 以防止这种情况
app.userInfoReadyCallback = res => {
this.setData({
userInfo: res.userInfo,
hasUserInfo: true
})
}
} else {
// 在没有 open-type=getUserInfo 版本的兼容处理
wx.getUserInfo({
success: res => {
app.globalData.userInfo = res.userInfo
this.setData({
userInfo: res.userInfo,
hasUserInfo: true
})
}
})
}
},
getUserInfo: function (e) {
wx.setStorageSync('userInfo', e.detail.userInfo);
app.globalData.userInfo = e.detail.userInfo
console.log(app.globalData.userInfo)
this.setData({
userInfo: e.detail.userInfo,
hasUserInfo: true
})
},
bindViewTap: function () {
this.setData({
hasUserInfo: false
})
},
})