這期內(nèi)容當(dāng)中小編將會給大家?guī)碛嘘P(guān)state和mutations方法怎么在Vue-cli中使用，文章內(nèi)容豐富且以專業(yè)的角度為大家分析和敘述，閱讀完這篇文章希望大家可以有所收獲。

首先，必須安裝vuex的依賴

npm install vuex --save-dev

創(chuàng)建專屬vuex的文件夾和store.js:

store.js里引入并應(yīng)用插件vuex

定義常量state,用于存放變量&&定義常量mutations存放對變量的處理方法：

導(dǎo)出Vuex.store的實(shí)例，參數(shù)為剛才定義的state和mutations:

最后，還要在入口js文件引入到Vue的實(shí)例之中：

之后，我們就可以在組件當(dāng)中，調(diào)用到我們在vuex存放的變量和方法：

首先：在父組件調(diào)用變量headTitle:

需要用到計(jì)算屬性computed和vuex的mapState:(注釋的寫法也可以，但是mapState可以引入多個(gè)變量，比較方便)

這樣，頁面

就會顯示我們保存的變量headTitle的值為“口袋香港”

之后，我嘗試在子組件，利用mutations的方法去改變headTitle的值：

結(jié)果，每次的改變，父組件的

都會跟隨改變。

上述就是小編為大家分享的state和mutations方法怎么在Vue-cli中使用了，如果剛好有類似的疑惑，不妨參照上述分析進(jìn)行理解。如果想知道更多相關(guān)知識，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

網(wǎng)站欄目：state和mutations方法怎么在Vue-cli中使用-創(chuàng)新互聯(lián)
文章轉(zhuǎn)載：http://weahome.cn/article/jiiod.html