vuex 本地儲存登入

2021-09-24 01:33:47 字數 763 閱讀 2066

//在登入頁面進行登入,跟後台進行對接,登入成功的時候提交乙個mutations儲存後台返回過來的登入資訊

let user =

this.$store.commit('adduser',user);

//在store資料夾的index.js下

import vue from 'vue';

import vuex from 'vuex';

vue.use(vuex);

let user = json.parse(localstorage.getitem('user')) || {} ; //持久儲存

let store = new vuex.store(,

mutations :

}})export default store;

//然後在router資料夾的index.js檔案下

import vue from 'vue'

import store from '../store' //引入store

import router from 'vue-router'

vue.use(router)

router.beforeeach((to, from, next) =>

else )

}} else

})export default router;

//這時候在整個專案頁面下都可以用store訪問到使用者資訊,如果退出登入的話清除本地儲存的使用者資訊就可以了

vuex與本地儲存,持久化儲存

在vuex的時候 重新整理以後裡面儲存的state就會被瀏覽器釋放掉,因為我們的state都是儲存在記憶體中的,所以一重新整理頁面就會把state中的資料重置,這就涉及到vue資料持久化的問題。在vuex中使用subscribe和plugins來實現本地儲存與vuex相關聯,實現vuex持久儲存 具...

vuex儲存和本地儲存的區別

vuex存的是狀態,儲存在記憶體,localstorage是瀏覽器提供的介面,讓你存的是檔案,以檔案的形式儲存在本地 vuex用於元件之間的傳值,localstorage則主要用於頁面之間的傳值 當重新整理頁面時,vuex儲存的值會丟失,localstorage不會 個人在使用的時候,覺得用loca...

Web 本地儲存和Vue本地儲存例項

資料的設定和讀取比較方便。容量較大,sessionstorage大約為5mb,localstorage大約為20mb。只能儲存字串,若想要儲存json物件,則可以使用window.json.stringify 或者parse 進行序列化和反序列化編碼 sessionstorage的儲存週期只有一次會...