vue使用$store.commit() undefined報錯的解決
vue使用$store.commit() undefined報錯
Uncaught (in promise) TypeError: Cannot read properties of undefined (reading ‘commit’)
這里我想把token和userInfo分別存入sessionStorage和LocalStorage中，登錄提交的時候報commit undefined
問題所在，我們沒有在全局中配置store，解決辦法如下
在main.js中配置store即可
成功存儲
vuex的this.$store.commit
在這里將介紹store的mutations和modules模塊化…
簡單的vue項目，父子組件之間的數(shù)據(jù)傳遞可以使用props或者$emit等方式傳遞，大中型項目，需要在不相關(guān)的平行組件之間傳遞數(shù)據(jù)，并且很多數(shù)據(jù)需要多個組件循環(huán)使用。
再使用上面方式會讓項目代碼冗余，不利于組件復(fù)用。
modules模塊化
當(dāng)項目比較大時，一個store數(shù)據(jù)會非常多而雜，不易管理?？梢越⒍鄠€“子倉庫”，分別對應(yīng)不同模塊做數(shù)據(jù)的讀取和操作。
1、在store下新建modules文件夾，在modules下新建user.js和common.js兩個"子倉庫"。
2、common.js管理主頁下的數(shù)據(jù)，user.js管理用戶信息數(shù)據(jù)：
3、將“子倉庫"掛載到主倉庫：
在main.js文件中注冊store
這樣就可以在任意組件中使用store中的數(shù)據(jù)，即使用計算屬性返回store中的數(shù)據(jù)到一個新屬性上，然后在模板中使用這個屬性值：
總結(jié)
以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
使用vxe-table合并單元格、分組列頭的詳細(xì)用法舉例
這篇文章主要介紹了使用vxe-table合并單元格、分組列頭的詳細(xì)用法,vxe-table通過rowspan和colspan配置合并單元格,使用columns的group屬性實現(xiàn)列頭分組,文中給出了詳細(xì)的代碼示例,需要的朋友可以參考下2025-06-06
關(guān)于Vue3中defineProps用法圖文詳解
在vue3中組件傳參有很多種方式,和v2大差不差,但是有的地方還是有很多的區(qū)別,下面這篇文章主要給大家介紹了關(guān)于Vue3中defineProps用法的相關(guān)資料,需要的朋友可以參考下2022-11-11
基于elementUI實現(xiàn)圖片預(yù)覽組件的示例代碼
這篇文章主要介紹了基于elementUI實現(xiàn)圖片預(yù)覽組件的示例代碼，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-03-03
這篇文章主要為大家詳細(xì)介紹了vue左右滑動選擇日期組件封裝的方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-04-04
這篇文章主要介紹了vue+springboot圖片上傳和顯示的示例代碼，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-02-02
vue項目實現(xiàn)通過ip地址訪問和localhost訪問方式
這篇文章主要介紹了vue項目實現(xiàn)通過ip地址訪問和localhost訪問方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-09-09
vue項目watch內(nèi)的函數(shù)重復(fù)觸發(fā)問題的解決
這篇文章主要介紹了vue項目watch內(nèi)的函數(shù)重復(fù)觸發(fā)問題的兩種解決方案，幫助大家更好的理解和學(xué)習(xí)使用vue，感興趣的朋友可以了解下2021-04-04
這篇文章主要介紹了vue 表單綁定與組件的相關(guān)資料，幫助大家更好的理解和學(xué)習(xí)使用vue框架，感興趣的朋友可以了解下2021-03-03
vue實現(xiàn)定時刷新數(shù)據(jù),每隔5分鐘執(zhí)行一次
這篇文章主要介紹了vue實現(xiàn)定時刷新數(shù)據(jù),每隔5分鐘執(zhí)行一次問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-01-01
vue導(dǎo)出excel和echart圖形分別在不同工作表的實現(xiàn)方法
這篇文章主要給大家介紹了如何使用vue實現(xiàn)導(dǎo)出excel和echart圖形分別在不同工作表,文中有詳細(xì)的代碼示例供大家參考,對大家的學(xué)習(xí)或工作有一定的幫助,需要的朋友可以參考下2023-10-10