如何使用Vuex

vuex是什麼？

vuex是適用於在vue專案開發時使用的狀態管理工具。

安裝vuex

cnpm i vuex -s

初始化store下index.js中的內容

import vue from 'vue'

import vuex from 'vuex'
//掛載vuex
vue.use(vuex)
//建立vuex物件
const store = new vuex.store(})
export default store

開啟main.js

import vue from 'vue'
import router from './router'
import store from './store'
vue.config.productiontip =
false
new vue(
)

>
}

methods:

}注意，請不要在此處更改state中的狀態的值

vuex的五大核心

state：儲存狀態（變數）$store.state.變數名

getters：對資料獲取之前的再次編譯，可以理解為 state 的計算屬性。

我們在元件中使用$sotre.getters.fun()

mutations ： 修 改 狀 態 ， 並 且 是 同 步 的 。 在 組 件 中 使 用

$store.commit('' ,params)。這個和我們元件中的自定義事件類似。

actions：非同步操作（返回的是promise物件）。在元件中使用是$store.dispatch('')

modules：store 的子模組，為了開發大型專案，方便狀態管理而使用的。這裡我們就不解釋了，用起來和上面的一樣。

如何使用vuex外掛程式

一.使用前需要做的事情 1.理解什麼是vuex？學習到vue之後最常見的就是使用父子元件傳值的問題，但是當我們在進行乙個較大型的新專案開發時候，元件關係較為複雜如果還堅持使用父子元件的話將會異常繁瑣，再加上有些資料需要幾個元件同時共享，所以這時候我們採用了vuex vue狀態管理模式 2.安裝vue...

VueX分了模組如何使用

1 建立乙個js檔案，命名為ad的乙個vuex的子模組 import vue from vue import vuex from vuex vue.use vuex const ad mutations export default ad 2 然後再index.js中引入該子模組 import vu...

vuex使用規則

下面利用webpack搭建平台。import vue from vue import vuex from vuex import index from index.vue vue.use vuex const store new vuex.store var root document.create...