Modules
`store/modules/a.js`
```javascript
export default {
state: {
name: "a 里面的 name"
},
mutations: {
},
actions: {
},
}
```
`store/modules/b.js`
```javascript
export default {
state: {
name: "b 里面的 name"
},
mutations: {
},
actions: {
},
}
```
`store/index.js`
```javascript
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
import a from "./modules/a";
import b from "./modules/b";
let store = new Vuex.Store({
modules: {
a,
b
}
})
export default store;
```
`about.vue`
```html
<template>
<div>
<p>{{nameA}} | {{nameB}}</p>
</div>
</template>
<script>
import {mapState} from "vuex";
export default {
computed: {
...mapState({
nameA: state=> state.a.name,
nameB: state=> state.b.name,
})
}
}
</script>
```
`main.js`
```javascript
import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
Vue.config.productionTip = false
new Vue({
router,
store,
render: h => h(App)
}).$mount('#app')
```