Vuex 介紹
這篇會介紹 Vuex 的基本名詞以及他們的差異!
在撰寫 Vue 專案的過程中,時常會遇到多個檔案需要使用同樣變數的情況,而變數雖然可以透過 props 或 emit 的形式來傳遞,但卻也變得麻煩許多。
因此,這時候就出現了 Vuex 來解決這個問題!
目錄
State
- 儲存全域變數的地方
```javascript
state: {
count: 0
}
```
Mutation
- 能改變state的唯一一個地方
- 函式形式
```javascript
mutation: {
increment(){
state.count++;//直接改變state裡的變數
}
}
```
Action
- 在 .vue 裡可以用 store.dispatch()的方式呼叫這邊的函式
- 函式形式
```javascript
action: {
increment (context) {
context.commit('increment')//會做mutation的函式
}
}
```