Uni-app登陸態管理（vuex）

應用中，保持登陸狀態是常見需求，本文講解使用uni-app框架時如何保持用戶登陸狀態。

即：初次進入應用爲未登陸狀態------->登陸---------->關閉應用，再次打開--------->爲已登陸狀態

傳統應用保持登陸狀態的方式是經過讀取 cookie 來判斷是不是登陸狀態，可是uni-app不支持對cookie的讀寫。由於uni-app框架的主體是 VUE，因此能夠使用  vuex  進行登陸態管理。

 關於vuex中定義的全局變量和方法須要定義在指定目錄的文件內。

即在項目目錄下新建名稱爲  store  的目錄，目錄下建立用於定義全局變量和方法的  js  文件，以下圖：

  index.js文件內容以下圖所示：

想要定義的這個 js 文件中的變量和方法能在各個頁面使用並生效，須要先在項目目錄下的  main.js  文件中導入這個  js  文件並聲明方法，以下圖所示：

聲明結束後就能夠在頁面中監控全局變量和相應方法了，下面在一個登陸頁面中具體展現。

先在頁面導入vuex的方法，以下：

而後，在 computed 計算屬性方法中使用  mapState 對全局變量進行監控，在 method中使用  mapMutations  進行全局方法監控，以下所示：

定義登陸成功後跳轉到我的中心的函數，以下：

網絡請求成功後，在回調函數 success 中調用該方法，並把回調函數的返回值數據傳給 login 方法，以下：

隨後  index.js  文件中的login方法會把傳過來的用戶數據保存在本地緩存中。

app沒等進入應用時由APP.vue文件中的周期函數對app進行監聽，因此在加載函數中定義方法，從本地緩存中取出用戶數據進行登陸，這樣只要不清除本地緩存，每次打開應用的時候都會時登陸狀態，不須要反覆發起網絡登陸請求，以下：