uni-app 保持登錄狀態 (Vuex)


在小程序中,保持登錄狀態是很常見的需求,今天就把寫一寫使用uni-app框架的保持登錄狀態功能是怎樣實現的。

一、場景需求

1、場景:初始打開---登陸---關閉,再次打開---(已登錄)上次關閉前的頁面

2、cookie:傳統應用保持登錄狀態的方式是通過讀取 cookie 來判斷是否是登錄狀態,但是uni-app不支持對cookie的讀寫。

3、實現:uni-app 的官網的API 有這樣一欄“數據緩存”,而且uni-app框架的主體是 VUE,那么我們就用 uni.setStorage 和  vuex  進行登錄狀態管理。

二、實現過程

1、vuex的聲明和使用 請看 《uni-app 使用Vuex+ (強制)登錄

2、在store/index.js 中

3、在App.vue 

  每次進入應用前,由App.vue 中的周期函數進行監聽,所以在加載函數中定義方法,從本地緩存中取出用戶數據,然后調用login方法,不需要發起網絡登錄請求。

 

這樣就實現了,只有不清除本地緩存,每次打開小程序應用時,都是登錄狀態

三、總結

看到文檔,有同步和異步這兩種緩存數據,那么關於同步緩存和異步緩存的區別:
以Sync結尾的都是都是同步緩存,二者的區別是,異步不會阻塞當前任務,同步緩存直到同步方法處理完才能繼續往下執行。
通俗點說,同步就是你下步操作需要上一步必須完成才能往下執行,異步就是下面的代碼和這個操作沒什么關系就用異步啦。
使用異步,性能會更好;而使用同步,數據會更安全。

1、所以在App.vue中,先是使用了let userInfo  = uni.getStorageInfoSync('userInfo')||''; 同步去獲取緩存的數據,因為后續的操作依賴於更改storage后的數據,則需要同步。

2、在使用setStorageSync和setStorage的時發現setStorageSync不能傳入對象


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM