微信小程序開發(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)//將用戶信息打印至控制臺
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)控制臺緩存頁面會(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)文章
微信小程序?qū)W習(xí)總結(jié)（一）項(xiàng)目創(chuàng)建與目錄結(jié)構(gòu)分析
這篇文章主要介紹了微信小程序?qū)W習(xí)總結(jié)（一）項(xiàng)目創(chuàng)建與目錄結(jié)構(gòu),總結(jié)分析了微信小程序項(xiàng)目創(chuàng)建、配置方法以及目錄結(jié)構(gòu)、文件功能,需要的朋友可以參考下2020-06-06
js檢測IE8及以下瀏覽器版本并做出提示的函數(shù)代碼
這篇文章主要介紹了js檢測IE8及以下瀏覽器版本并做出提示的函數(shù)代碼,需要的朋友可以參考下2023-02-02
JS中比Switch...Case更優(yōu)雅的多條件判斷寫法
這篇文章主要給大家介紹了關(guān)于JS中比Switch...Case更優(yōu)雅的多條件判斷寫法，文中通過示例代碼介紹的非常詳細(xì)，對大家學(xué)習(xí)或者使用JS具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧2019-09-09
這篇文章主要介紹了js圖片輪播特效，圖片切換效果特別適合做產(chǎn)品演示，感興趣的小伙伴可以參考下2015-09-09
超過80%的候選人對下面這道JS面試題的回答情況連及格都達(dá)不到。這究竟是怎樣神奇的一道JS面試題？他考察了候選人的哪些能力？對正在讀本文的你有什么啟示？2017-03-03
下面小編就為大家?guī)硪黄猨s實(shí)現(xiàn)樓層效果的簡單實(shí)例。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-07-07
JavaScript查看代碼運(yùn)行效率console.time()與console.timeEnd()用法
今天小編就為大家分享一篇關(guān)于JavaScript查看代碼運(yùn)行效率console.time()與console.timeEnd()用法，小編覺得內(nèi)容挺不錯(cuò)的，現(xiàn)在分享給大家，具有很好的參考價(jià)值，需要的朋友一起跟隨小編來看看吧2019-01-01
今天小編就為大家分享一篇layui樹形菜單動(dòng)態(tài)遍歷的例子，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09
xml轉(zhuǎn)json的js代碼，需要的朋友可以參考下2012-08-08
JavaScript學(xué)習(xí)總結(jié)(一) ECMAScript、BOM、DOM（核心、瀏覽器對象模型與文檔對象模型）
JavaScript是一種解釋執(zhí)行的腳本語言，是一種動(dòng)態(tài)類型、弱類型、基于原型的語言，內(nèi)置支持類型，它遵循ECMAScript標(biāo)準(zhǔn)。它的解釋器被稱為JavaScript引擎，為瀏覽器的一部分，廣泛用于客戶端的腳本語言，主要用來給HTML增加動(dòng)態(tài)功能2018-01-01