<image v-if="userInfo.photo!=''" mode="aspectFit" :src="userInfo.photo" class="avatar vam"/>
<image v-else mode="aspectFit" src="/static/images/avatar.png" class="avatar vam"/>
<text class="vam marl20 fz32">{{userInfo.nick_name}}
<van-button class="marl10 hide" type="default" v-if="canIUse&& !hasAvator" open-type="getUserInfo" size="mini" @getuserinfo="bindGetUserInfo">微信昵称头像</van-button>
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
js部分：
getWxAvatar(){//获取微信昵称和头像
let that=this;
let userInfo = wx.getStorageSync('userInfo');
console.log(userInfo);
if(userInfo && userInfo.hasOwnProperty('photo')){
this.userInfo=userInfo;
if(userInfo.photo !=''){
this.hasAvator=true;
}
}else if (this.canIUse){
// 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回
// 所以此处加入 callback 以防止这种情况
app.userInfoReadyCallback = res => {
let userinfo=res.userInfo;
console.log(userinfo);
userinfo.photo=userinfo.avatarUrl;
userinfo.nick_name=userinfo.nickName;
that.userInfo=userinfo;
that.hasAvator=true;
wx.setStorageSync('userInfo',userinfo);
}
}else{
// 查看是否授权
wx.getSetting({
success (res){
if (res.authSetting['scope.userInfo']) {
// 已经授权，可以直接调用 getUserInfo 获取头像昵称
wx.getUserInfo({
success:function(res) {
let userinfo=res.userInfo;
console.log(userinfo);
userinfo.photo=userinfo.avatarUrl;
userinfo.nick_name=userinfo.nickName;
that.userInfo=userinfo;
that.hasAvator=true;
wx.setStorageSync('userInfo',userinfo);
}
})
}
}
})
}
},
bindGetUserInfo (event) {
let userinfo=event.mp.detail.userInfo;
userinfo.photo=userinfo.avatarUrl;
userinfo.nick_name=userinfo.nickName;
this.userInfo=userinfo;
this.hasAvator=true;
wx.setStorageSync('userInfo',userinfo);
},
