vue-form-wizard
vue-form-wizard copied to clipboard
Lazy loading issue
I have two differents routes in my wizard. Route A and B. They're separated by if condition. All of the steps are lazy-loaded (or at least I want them to be), because I don't want to load all components of path A is someoone chooses path B.
My vue-wizard looks like this
<form-wizard >
<tab-content>
<step1 />
</tab-content>
<tab-content :lazy="true"
v-if="versionA"
>
<step2A/>
</tab-content>
<tab-content :lazy="true"
v-else>
<step2B />
</tab-content>
<tab-content :lazy="true"
v-if="versionA">
<step3A/>
</tab-content>
<tab-content :lazy="true"
v-else>
<step3B/>
</tab-content>
</form-wizard>
But when I print logs in mounted() of each of the components, I can see that whole route B is loaded at once. Same issue with lazy-loading appears even in simplest example. Unless I'm using it incorrectly?
Yes, components get mounted but the rendered HTML should be empty.
This is a real pain because It will be mounted but without the HTML things like this.$ref will throw undefined errors
You can always choose to not use "lazy-loading", would that fit your case?
I have relied on this and realized that the package I just downloaded does not have this feature #316 in its source code.
@MrEduar thanks a lot for pointing that out.. I was wondering why the lazy flag seemed to make no difference
The last release is more than 3 years old.. 31 commits since the last release
But you can get all the latest commits by installing it like this in your package.json:
"vue-form-wizard": "git://github.com/binarcode/vue-form-wizard.git#4ba261a",
AHHHHHH ! This explain so many things !!!!!
@fabdbt @BRafols @cristijora Can you please make a new release on master ?
Thanks