Hey in this Post We will see how can we add multiple Vuejs modules at once.
We all needed to import modules each time we create one on our modules...
For further actions, you may consider blocking this person and/or reporting abuse
This is good, but how you load store files from folders? Lets say you have
chats
index.js // module store file
users
index.js // module store file
How we can import these modules store files dynamically? I mean we may not know the folder (chats, users) names.
any idea how this can be done please
I have done a nice set up for laravel vue module which you can see and also made a tutorial
github.com/hkmsadek/laravel-vue-mo...
youtube.com/watch?v=nW0eGVb0W-A&t=2s
Thank you so much, you do a good trick really
Thanks :)
Hi everyone, anyone looking for an extended solution with the tutorial please look at this with gihub code
github.com/hkmsadek/laravel-vue-mo...
Watch the tutorial from here.
https://www.youtube.com/watch?v=nW0eGVb0W-A&t=2s
Thank you @mohamed for such a nice idea.
Hi, thank you for the post.
I have a question if you can help me.
I have the following folder structure in my project
project
|
-store
|
|-constants.js
|-modules
|
|-someModule
|-otherModule
|-index.js (just as in your post)
This is a sample from my constants file
//Actions
export const USER_SET = 'user/SET'
export const USER_GET_ROLES = 'user/GET_ROLES'
//Mutations
export const USER_SET_BY_KEY = 'user/SET_BY_KEY'
export const USER_SET_ROLES = 'user/SET_ROLES'
And in my modules I use the constant as name for the actions, mutations, getters, like in this sample
const actions =
{
[constants.USER_SET]: ({commit}, user) =>
{
let response = {'data': user, 'key': 'user' }
commit(constants.USER_SET_BY_KEY, response)
},
}
The idea is that when I use in components, i use the constants file name too, this way I can change the name in one place
Like in this
...mapActions({
getRoles: constants.USER_GET_ROLES,
The thing is, even when the module are dinamically loaded by the index in the modules folder, Vuex doesn't recognize the actions, mutations, getters
I print the modules object in the index and i see that it has this properties empty
{
"customer": {
"state": {
"customers": null,
"contacts": null
},
"actions": {},
"mutations": {},
"getters": {}
},
.
.
.
.
}
If I go back to import every module manually and put then in the vuex individually, then vuex recognize the actions, mutations, getters
So thank you in advance if can you please point me in the right direction
p.s Sorry for my bad english, it's not my native language
Nevermind, It was a problem with the way I was telling vuex to use modules but thank you anyway
Glad you figured it out !
Ohh that what I wanted, Thanks you soo much.
I created block builder, combined your solution + v-bind:is and it is great, I just create new file in modules and all other is done, I dont care for anything :D
Is it possible to lazy load the VueX modules?
This is cool Mohammed, thank you.