Skip to content

fix: replace v-show to v-if in order to use it with all types of vue components #289

New issue

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

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

Already on GitHub? # to your account

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

gavrashenko
Copy link
Contributor

@gavrashenko gavrashenko commented Aug 7, 2020

Using v-show directive for hiding slots can cause some issues, for example, if you have a modal content for loader provided by vue-portal it can't be hidden just with display: none ( v-show ). In such cases it's important to use v-if directive.

This code won't work if I'll use vue-portal because portals can't be hidden via v-show and as the result - we will see a modal all the time on a screen.

<InfiniteLoading @infinite="infinite">
    <template v-slot:spinner>
        <VuePortalModalLoader></VuePortalModalLoader> // <--- This component will be never hidden because of v-show
    </template>
</InfiniteLoading>

This issue can be fixed replacing all v-show's which are using to hide slot content to v-if directives.

@gavrashenko gavrashenko changed the title replace v-show to v-if in order to be able to use it with all Vue com… fix: replace v-show to v-if in order to use it with all types of components Aug 7, 2020
@gavrashenko gavrashenko changed the title fix: replace v-show to v-if in order to use it with all types of components replace v-show to v-if in order to be able to use it with all Vue com… Aug 7, 2020
@gavrashenko gavrashenko changed the title replace v-show to v-if in order to be able to use it with all Vue com… fix: replace v-show to v-if in order to use it with all types of vue components Aug 7, 2020
# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant