<script>
/*
模块中的state会变成rootState的一个属性,属性名为模块名
模块中的state
rootState
this.$store.state.msg
moduleA state
this.$store.moduleA.msg
moduleB state
this.$store.moduleB.msg
模块中的getters
模块中的getter和rootGetter会放在同一个对象中
this.$store.getters 所以尽量不要其相同名字
*/
</script>
<script>
/*
为什么会有命名空间
因为getter添加不管是哪个模块的,都会直接被添加到
this.$store.getters中,如果两个名字相同,所以需要添加
namespaced: true
对应模块的getter就会变成"模块名/getter名"
模块中的getter里的第一个参数指向的是当前模块的state
modules: {
moduleA: {
getters: {
getter名字 (state, getters, rootState,rootGetters) {
// state和getters都指当前模块的内容
// rootState指全局中的state包含了各个模块的state
}
}
}
}
除了getter名字会变成 mudule名/getter名 外
mutation和action也会变成
module名/mutation名字
module名/action名字
建议模块添加namespaced属性
*/
<script>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<!--
state不会有任何变化
rootState
this.$store.state.xxx
模块state
this.$store.state.模块名.xxx
getters添加了namespaced之后 会给对应的getter添加模块名变成 "模块名/getter名字" 全局的getter不会有任何变化
想要获取到对应的getter
this.$store.getters['模块名字/getter名字']
模块的getter (state, getters, rootState, rootGetters) {
// state getters表示当前模块的state和getters
// rootState rootGetters表示全局中的state和getters
}
mutations和getters相同,添加namespaced之后会给对应的mutation添加模块名 变成 "模块名/mutation名字"
commit('模块名/mutation名字', 数据)
模块中的mutation (state, 载荷) {
// 没有变化
}
actions同上,添加了namespaced属性后,会给对应的action添加模块名变成 "模块名/action名字"
dispatch('模块名/action名字', 数据)
模块中的action ({commit}, 数据) {
// 模块中的action里的commit只能提交当前模块中的mutation
}
若需要在带命名空间的模块注册全局 action,你可添加 root: true
可以访问到全局的
当前模块的变成 '模块名/action名字'
-->
</body>
</html>