We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Getter
store中的计算属性。getter接收state作为第一个参数,其他getter作为第二个参数。 getter会暴露为store.getters对象。
store
getter
state
store.getters
mapGetters辅助函数将store中的getter映射到局部计算属性
mapGetters
Mutation
mutation是更改store中状态的唯一方法。每个mutation都有一个接受字符串的事件类型(type)和一个回调函数。回调函数接受state作为第一个参数。第二个参数为commit提交的payload 要出发回调函数需要以相应的type调用store.commit方法。 可以在组件中使用this.$store.commit('xxx')提交mutation,或者使用mapMutations辅助函数将组件中的methods映射为store.commit调用。
mutation
commit
payload
type
store.commit
this.$store.commit('xxx')
mapMutations
methods
mutation必须是同步类型
Action
Action类似与Mutation。不同之处在于:
Action函数接受一个与store实例具有相同方法和属性的context对象作为参数。因此可以调用context.commit提交一个mutation,或者通过context.state和context.getters来获取state和getters
context.commit
context.state
context.getters
getters
Action通过store.dispatch触发。Action同样支持载荷方式和对象方式进行分发
store.dispatch
// 以载荷形式分发 store.dispatch('incrementAsync', { amount: 10 }) // 以对象形式分发 store.dispatch({ type: 'incrementAsync', amount: 10 })
在组件中使用 this.$store.dispatch('xxx') 分发 action,或者使用 mapActions 辅助函数将组件的 methods 映射为 store.dispatch 调用
this.$store.dispatch('xxx')
mapActions
Module
vuex可以将store分割成模块module。每个模块拥有自己的state,getter,mutation,action,甚至嵌套子模块。
module
模块内部的getter和mutaion接收的第一个参数是模块的局部状态对象。对于模块内部的action,state通过contaxt.state对象暴露出来。根结点状态则为context.rootState。对于模块内部的getter,根结点状态会作为第三个参数暴露出来。
mutaion
action
contaxt.state
context.rootState
Plugins
vuex的store接受plugins选项。这个选项暴露出每次 mutation 的钩子。vuex插件就是一个函数,它接受store作为唯一参数
plugins
const myPlugin = store => { // 当 store 初始化后调用 store.subscribe((mutation, state) => { // 每次 mutation 之后调用 // mutation 的格式为 { type, payload } }) }
然后像这样使用:
const store = new Vuex.Store({ // ... plugins: [myPlugin] })
在插件中不允许直接修改状态——类似于组件,只能通过提交 mutation 来触发变化。
The text was updated successfully, but these errors were encountered:
No branches or pull requests
Vuex 笔记
Getter
store
中的计算属性。getter
接收state
作为第一个参数,其他getter
作为第二个参数。getter
会暴露为store.getters
对象。mapGetters
辅助函数将store
中的getter
映射到局部计算属性Mutation
mutation
是更改store
中状态的唯一方法。每个mutation
都有一个接受字符串的事件类型(type)和一个回调函数。回调函数接受state
作为第一个参数。第二个参数为commit
提交的payload
要出发回调函数需要以相应的
type
调用store.commit
方法。可以在组件中使用
this.$store.commit('xxx')
提交mutation,或者使用mapMutations
辅助函数将组件中的methods
映射为store.commit
调用。Action
Action类似与Mutation。不同之处在于:
Action函数接受一个与store实例具有相同方法和属性的context对象作为参数。因此可以调用
context.commit
提交一个mutation
,或者通过context.state
和context.getters
来获取state
和getters
Action通过
store.dispatch
触发。Action同样支持载荷方式和对象方式进行分发在组件中使用
this.$store.dispatch('xxx')
分发 action,或者使用mapActions
辅助函数将组件的 methods 映射为store.dispatch
调用Module
vuex可以将store分割成模块
module
。每个模块拥有自己的state,getter,mutation,action,甚至嵌套子模块。模块内部的
getter
和mutaion
接收的第一个参数是模块的局部状态对象。对于模块内部的action
,state通过contaxt.state
对象暴露出来。根结点状态则为context.rootState
。对于模块内部的getter
,根结点状态会作为第三个参数暴露出来。Plugins
vuex的store接受
plugins
选项。这个选项暴露出每次 mutation 的钩子。vuex插件就是一个函数,它接受store作为唯一参数然后像这样使用:
在插件中不允许直接修改状态——类似于组件,只能通过提交 mutation 来触发变化。
The text was updated successfully, but these errors were encountered: