Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fallback slot is not showing up #12116

Closed
Daniel4Digital opened this issue Jun 4, 2021 · 3 comments
Closed

Fallback slot is not showing up #12116

Daniel4Digital opened this issue Jun 4, 2021 · 3 comments

Comments

@Daniel4Digital
Copy link

Daniel4Digital commented Jun 4, 2021

Version

2.6.13

Reproduction link

https://codepen.io/daniel4digital/pen/oNZqQgm

Steps to reproduce

Click the switch button, it will switch between two components with slots and without slots. The components without slots should not appear the slots passed to the components with slots

What is expected?

Should display the fallback slot, as it did on 2.6.12 with the key workaround:
https://codepen.io/daniel4digital/pen/XWMEyWE

What is actually happening?

Displays nothing:
https://codepen.io/daniel4digital/pen/oNZqQgm

PS: It is related with this fix: #11795

@posva
Copy link
Member

posva commented Jun 4, 2021

Remove the this. in templates.

@posva posva closed this as completed Jun 4, 2021
@Daniel4Digital
Copy link
Author

Daniel4Digital commented Jun 4, 2021

@posva allright... I tested without the this and now that report I did it works BUT there seems to exist a biggest problem on this last release. I still think it is related with this. Not sure though.

If I've a template with a v-if on a div + others html elements, for example:

         <template #body class="mx-3">
            <div v-if="loading" class="py-5 my-5">
                <custom-mdb-spinner big>
                    <div class="title pt-3">{{ trans('_v4.general.navigation.loading') }}</div>
                </custom-mdb-spinner>
            </div>

                <custom-mdb-input
                    id="url"
                    v-model="form.fields.url"
                    :label="trans('_v4.general.app.label.url')"
                    size="xs"
                    type="url"
                />

                <custom-mdb-input
                    id="comment"
                    v-model="form.fields.comment"
                    :label="trans('_v4.general.app.label.description')"
                    size="xs"
                    type="text"
                />

        </template>

On the last version it was working fine. But on this new one, I need to add an extra div with v-else:

        <template #body class="mx-3">
            <div v-if="loading" class="py-5 my-5">
                <custom-mdb-spinner big>
                    <div class="title pt-3">{{ trans('_v4.general.navigation.loading') }}</div>
                </custom-mdb-spinner>
            </div>
            <div v-else>
                 <custom-mdb-input
                    id="url"
                    v-model="form.fields.url"
                    :label="trans('_v4.general.app.label.url')"
                    size="xs"
                    type="url"
                />

                <custom-mdb-input
                    id="comment"
                    v-model="form.fields.comment"
                    :label="trans('_v4.general.app.label.description')"
                    size="xs"
                    type="text"
                />
            </div>
        </template>

Diff between both, the code I had before, and the one I need to have now:
https://www.diffchecker.com/8x5kMbH1

@posva
Copy link
Member

posva commented Jun 4, 2021

already fixed

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants