簡述對vuex的理解


1.vuex是什么?
    vuex是vue框架的狀態管理器。
 
2.如何使用?
    在main.js中引入store;新建store,引入state,const,getters,mutations,actions;
 
3.使用他的功能場景?
    單頁應用,組件之間的狀態,音樂播放,登錄狀態,加入購物車,定位
 
4.不用Vuex會帶來的問題
    可維護性下降,若是修改數據就要維護三個地方;
    可讀性下降,因為一個組件里的數據根本看不出來是從哪里來的;
    增加耦合,大量的上傳派發會讓耦合性大大增加;
 
5.vuex的屬性
    有五種屬性,State,Getter,Mutation,Action,Module。
    (1)State特性:
            存儲數據,存儲狀態。將vuex比作一個倉庫,倉庫里面存放許多對象。而state就是數據源的存放地,對應vue里面的data。
            state里面存放的數據是響應式的,Vue組件從store中讀取數據,若是store中的數據發生改變,依賴這個數據的組件也會發生更新。
            通過mapState把全局的state和getters映射到當前組件的computed計算屬性中。
    (2)getter特性:
            對state進行計算操作,他就是store的計算屬性。防止多次計算降低性能。
            可以在多組間之間復用。若是一個狀態只在一個組件內使用就可以不用getters。
    (3)Mutation特性:
            被action調用。功能非常單一:只是改變state數據和狀態。
    (4)Action特性:
            處理異步程序。
 (5)Module模塊:
    vuex允許將store分成若干模塊,每個模塊都可以包含以上四種屬性。若調用一個變量,但是不同的模塊都有的一個同名的變量,這是調用時就會出問題。解決:在模塊中添加命名空間:namespaced:true;調用時采用對象的形式調用 某個模塊的某個變量就可以了。例如:...Vuex.mapState({a:state=>state.homeStore.a}) ; ...mapActions({fn:"homeStore/fn"})  
   
6.數據流動
         
    
7.輔助函數
    屬性: mapState , mapGetters    在computed中
    方法: mapMutations , mapActions  在methods中
 
 
                                                                            流程圖


免責聲明!

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



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