vuex的基本使用

2021-10-05 05:23:46 字數 995 閱讀 6045

首先先建立乙個store.js

安裝vue,vuex什麼的就不說了

這是乙個倉庫

import vue from

'vue'

import vuex from

'vuex'

vue.

use(vuex)

//裝載資料的乙個倉庫

const state =

//修改倉庫的方法

const mutations=

,reduce

(state)

}//暴露乙個物件

export

default

newvuex.store

()

建立乙個count.vue

這個元件使用store倉庫

}<

/h3>

>

"$store.commit('add')"

>

+<

/button>

"$store.commit('reduce')"

>

-<

/button>

<

/p>

<

/div>

<

/template>

//引入倉庫

import store from

'@/vuex/store'

export

default},

//註冊倉庫

store

}<

/script>

<

/style>在主頁面中使用就可以實現乙個加減的效果

**中需要注意的點用「//」標註了出來

vuex的基本使用

vuex的特點 1.多元件共享狀態 多個元件使用同乙個資料 2.任何乙個元件發生改變,其他元件也要跟著發生相應的變化 基本使用 安裝vuex npm install vuex 建立例項 import vuex from vuex import vue from vue vue.use vuex co...

vuex的基本使用

npm i vuex s在index.js中寫入以下 import vue from vue import vuex from vuex vue.use vuex state是全域性狀態 const state 全域性的計算屬性 const getters 引數getters可以獲取getters裡...

vuex的基本使用

首先先建立乙個store.js 安裝vue,vuex什麼的就不說了 這是乙個倉庫 import vue from vue import vuex from vuex vue.use vuex 裝載資料的乙個倉庫 const state 修改倉庫的方法 const mutations reduce s...