微信小程序開發(fā)之獲取用戶信息的兩種方法
今天介紹兩種微信小程序獲取用戶信息的方法
第一中直接授權(quán)獲?。ㄔ谕豁撁嬷校?/strong>
首先在微信程序一個(gè)頁面的WXML文件寫入獲取用戶信息的按鈕
<!-- bindTap用于綁定事件 -->
<button type="default" bindtap="getUserInfor"> 登錄</button>
<!-- 展示獲取到的用戶信息 -->
<image src="{{userinfor.avatarUrl}}" />
<view> {{userinfor.nickName}}</view>
然后是在js頁面寫具體點(diǎn)擊事件的邏輯結(jié)構(gòu)
data: {
userinfor:{},//用戶存放獲取到的用戶信息
},
getUserInfor(e){
wx.getUserProfile({
desc: '用來完善用戶個(gè)人信息',//展示的消息
success:(res)=>{
console.log(res.userInfo)//將用戶信息打印至控制臺(tái)
this.setData({ userinfor:res.userInfo})//將信息保存到定義的容器里
}
})
}
第二種方式可以實(shí)現(xiàn)不同頁面獲取用戶信息：
第二中的主要思想就是將用戶信息先獲取到，然后將其存放在緩存中，然后再跳轉(zhuǎn)到其他頁面對緩存中的數(shù)據(jù)進(jìn)行獲取
首先我們要從A頁面進(jìn)入到B頁面
A頁面WXML代碼
<button bindtap="goto" > 進(jìn)入登錄頁面</button>
<!-- 展示用戶信息 -->
<image src="{{userinfor.avatarUrl}}" />
<view> {{userinfor.nickName}}</view>
A頁面JS頁面代碼
//
data: {
userinfor:{},
},
goto(){
wx.navigateTo({
url: '../text/text',
})
}
B頁面WXML頁面代碼
<button type="default" bindtap="getUserInfor"> 登錄</button>
B頁面JS頁面代碼
data: {
},
getUserInfor(e){
wx.getUserProfile({
desc: '用于獲取用戶信息',
success:(res)=>{
const userinfor = res.userInfo
//將用戶數(shù)據(jù)寫入緩存
wx.setStorageSync('UserInfo', userinfor);
//跳回前一個(gè)頁面
wx.navigateBack({
delta:1
})
}
})
}
當(dāng)我們點(diǎn)擊B頁面登錄按鈕并且允許獲取用戶信息時(shí)，我們可以發(fā)現(xiàn)控制臺(tái)緩存頁面會(huì)跳出一個(gè)KEY值為UserInfo的鍵值，這就說明我們已經(jīng)把用戶的信息存放入緩存之中，接下來就是如何將緩存中的信息取出來，接下來我們就來到A頁面編寫獲取緩存中數(shù)據(jù)的方法，
A頁面JS頁面中添加onShow方法，或者在原有的onShow方法里添加下列方法中的代碼
data: {
userinfor:{},
},
onShow(){
const userinfor = wx.getStorageSync('UserInfo')
this.setData({ userinfor })
}
這時(shí)就成功將用戶數(shù)據(jù)寫入緩存在從其他頁面讀取數(shù)據(jù)
總結(jié)
其實(shí)兩種獲取方式都是一樣的，都是用wx.getUserProfile方法進(jìn)行獲取，但是只是采取了不同的數(shù)據(jù)處理方式，讓開發(fā)更加的便捷
到此這篇關(guān)于微信小程序開發(fā)之獲取用戶信息的文章就介紹到這了,更多相關(guān)微信小程序獲取用戶信息內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
JS判斷元素為數(shù)字的奇異寫法分享，需要的朋友可以參考下2012-08-08
H5跳轉(zhuǎn)小程序按鈕不顯示(wx-open-launch-weapp)踩坑指南
這篇文章主要給大家介紹了關(guān)于H5跳轉(zhuǎn)小程序按鈕不顯示(wx-open-launch-weapp)踩坑的相關(guān)資料,文中介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2023-02-02
這篇文章主要介紹了JavaScript迭代器的含義及用法,迭代器就是為實(shí)現(xiàn)對不同集合進(jìn)行統(tǒng)一遍歷操作的一種機(jī)制，只要給需要遍歷的數(shù)據(jù)結(jié)構(gòu)部署Iterator接口，通過調(diào)用該接口，或者使用消耗該接口的API實(shí)現(xiàn)遍歷操作。,需要的朋友可以參考下2019-06-06
BootStrap Table 后臺(tái)數(shù)據(jù)綁定、特殊列處理、排序功能
本節(jié)主要介紹Bootstrap的后臺(tái)數(shù)據(jù)綁定、特殊列處理及列的排序功能，代碼簡單易懂，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的的朋友參考下吧2017-05-05
通過 JS 獲取頁面相關(guān)的尺寸是比較常見的操作,尤其是在動(dòng)態(tài)計(jì)算頁面布局時(shí),今天我們就來學(xué)習(xí)一下幾個(gè)獲取頁面尺寸的基本方法,需要的朋友可以參考下2023-09-09
JS獲得多個(gè)同name 的input輸入框的值的實(shí)現(xiàn)方法
這篇文章主要介紹了基于JS代碼實(shí)現(xiàn)input密碼輸入框輸入密碼變黑點(diǎn)密文以及JS獲得多個(gè)同name 的input輸入框的值的實(shí)現(xiàn)方法，代碼簡單易懂，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友參考下2017-01-01
這篇文章主要介紹了Javascript組合繼承方法代碼實(shí)例解析,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-04-04
這篇文章主要介紹了淺析Bootstrap驗(yàn)證控件的使用 的相關(guān)資料,非常不錯(cuò)具有參考借鑒價(jià)值，需要的朋友可以參考下2016-06-06
這篇文章主要介紹了使用JS代碼實(shí)現(xiàn)俄羅斯方塊游戲,代碼簡單易懂，非常不錯(cuò)，具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2018-08-08
JavaScript中檢測對象類型的運(yùn)算符有：typeof、instanceof，還有對象的constructor屬性： 1) typeof 運(yùn)算符 typeof 是一元運(yùn)算符，返回結(jié)果是一個(gè)說明運(yùn)算數(shù)類型的字符串。下面由小編給大家分享JavaScript中的4種類型識(shí)別方法，需要的朋友可以參考下本文2015-09-09