Add option for authoring Vuex module
DrSensor opened this issue · 0 comments
DrSensor commented
For authoring Vuex module there is kind of usage like:
- 1 page, many components
- multiple pages, multiple/single components on each page
To support that usage, in storybook implementation its need:
- Vue-router to support multiple pages
- Vue mixins to reduce many declarations of
...map{Vuex}
Vue Mixins
I also think of this template not also publishing vuex-modules but also vue-mixins that consist ...map{vuex}
declarations. Something like:
mixins/mymodule.js
export default {
computed: {
...mapGetters('mymodule', ['status', 'itemName'])
},
methods: {
...mapActions('mymodule', ['add', 'delete'])
}
}
then in scenario
use it like
<script>
import mymoduleMix from '../mixins/mymodule'
export default {
mixins: [mymoduleMix]
}
</script>
Project Structure
When authoring vuex modules, the project structure need to support multiple .vue
file in one scenario.
vue_router = false
-> 1 page, many components
Scenario1/
├── Component1.vue
├── Component2.vue
└── Layout.vue // this is where Component1 and Component2 being use
vue_router = true
-> add addon storybook-router
-> multiple pages, multiple/single components on each page
Scenario1/
├── Layout1.vue
├── Layout2
│ ├── Component1.vue
│ ├── Component2.vue
│ └── Layout.vue
├── App.vue
└── routes.js
click 👍 if you agree!
👇