state
1) the state of the object vuex management
2) It should be unique
const state = {
xxx:initValue
}
mutations
1) A method comprising a plurality of objects (callback functions) direct update state of
2) Who will trigger: action in the commit ( 'mutation name')
3) can contain only synchronous code can not write asynchronous code
actions
1) comprising a plurality of time callback objects
2) by executing: call the mutation to trigger the commit (), Introduction to update state
3) Who will trigger: set up in: $ store.dispatch ( 'action name', data1) // 'zzz'
4) may comprise asynchronous code (timer, ajax)
const actions = {
zzz（{commit,state},data1）{
commit('yyy',{data1})
}
}
getters
1) calculated drink comprising attributes (GET) object
2) Who reads: component: $ store.getters.xxx
const getter = {
mmm(state) {
return...
}
}
modules
1) comprising a plurality of module
2) a store is a module configuration object
3) with a component (containing shared data) corresponding to
Object store outwardly exposed
export default new Vuex.Store({
state,
mutations,
actions,
getters
})
Components
import {mapState, mapGetters, mapActions} from 'vuex'
export default {
computed: {
...mapState(['xxx']),
...mapGetters(['mmm']),
}methods: mapActions(['zzz'])
}
{{xxx}} {{mmm}} @click="zzz(data)"
Mapping store
import store from './store'
new Vue({ store
}）
store objects
1) All components used vuex managed one more attribute $ store, he is a target store
2) properties:
state: state registration of objects
getters: Registered getters objects
3) Method:
dispatch (actionName, data): call to action Distribution