vuex是vue.js專門為了管理元件與元件之間的關係而提供的一種狀態管理模式
下面簡單介紹一下vuex在專案中的應用場景
首先我們要做的是安裝vuex到我們的專案中
yarn add vuex我們在index.js中首先引入vue和vuex，在使用過vuex後就可以進行乙個vuex的例項化了
import vue from 'vue'
import vuex from 'vuex'
vue.use(vuex)
const store = new vuex.store()
export default store
這時，就可以在總入口檔案，main.js進行引入和使用了
import store from './store/index.js'
//並且在例項vue的時候進行引入，為了讓我們的其他元件都可以拿到$store
new vue(
})
我們可以在search中進行列印this，可以發現可以通過this.$store.state來拿到我們的istabbershow。
那如果我們不需要在search中讓底部導航欄顯示，那該如何修改這個值呢？
vuex還有乙個mutations屬性，可以通過它來封裝一些可以改變state中的值
比如
mutations: ,
hide (state)
}
這時，我們search頁面中就不會顯示底部導航欄了，不過別的頁面元件也不顯示了，這顯然不是我們的需求，那我們需要在銷毀生命週期樹的時候將底部導航欄在顯示出來
通過beforedistory鉤子函式通過this.$store.commit('show')來將vuex的state屬性中的istabbershow改為true
這樣，我們實現底部導航欄按需求顯示與消失的需求就解決了。
總結：將值存入vuex(倉庫)後，如果想修改值，可以通過在mutations定義修改值的方法，在元件中通過this.$store.commit(方法名)的方法來實現我們的需求
在專案中經常會遇到的乙個場景：我們在不同的元件需求請求同一組資料，如果都進行請求的話，無疑增加了一筆很大的效能消耗，那我們也可以將非同步請求資料也放在vuex倉庫中，這樣，在我們請求過資料後，第二個頁面元件也需要這個資料的話，就不需要傳送請求，可以直接進行呼叫。
首先我們可以在state中定義乙個datalist：[ ] 來存放我們即將請求到的資料，這樣元件就可以通過this.$store.state來拿到
可以通過vuex例項中的actions屬性來進行解決我們的這個需求。
actions:
}).then(res => )
}}mutations:
}
此時我們如果第二個元件也需要請求，只需要加乙個判斷，如果裡面有資料了，直接通過this.$store.state來進行獲取，如果沒有，再通過上面所描述的進行請求資料。
以上就是我們在專案中經常遇到的通過vuex來解決的兩個小案例，若有出入，歡迎指正。
專案vuex處理
扒拉乙個專案的vuex看著比較舒服，1 檔名作為module 名 store index.js 新增到vue中 modules d2admin index.js 將檔案內容給模組 modules account.js db.js fullscreen.js gray.js log.js menu.j...
Vuex 專案結構
vuex 並不限制你的 結構。但是，它規定了一些需要遵守的規則 應用層級的狀態應該集中到單個 store 物件中。提交 mutation 是更改狀態的唯一方法，並且這個過程是同步的。非同步邏輯都應該封裝到 action 裡面。只要你遵守以上規則，如何組織 隨你便。如果你的 store 檔案太大，只需...
vuex及其屬性應用
vuex 是什麼？vuex 是乙個專為 vue.js 應用程式開發的狀態管理構架。它採用統一式儲存管理和維護所有元件的可變化的狀態。也可以理解為是一種開發模式或框架，通過狀態集中管理驅動元件的變化，應用級的狀態集中放在store中，改變狀態的方式是提交mutations，非同步邏輯封裝在action...