Skip to content
This repository has been archived by the owner on Jul 31, 2024. It is now read-only.

[Feature request]VDropdown with class manipulation only eg. hidden #61

Open
nyambe opened this issue Mar 5, 2020 · 3 comments
Open

Comments

@nyambe
Copy link

nyambe commented Mar 5, 2020

Hello I have noticed that the VDropdown removes the vts content from the dom when not active. Is it posible to just have the component o add or hide a 'hidden' class. Maybe that is already posible, it's simple enough, right?

I love the philosophy of vuetensils, I think that would be inline with what you have in mind with this project.

changing this
v-if="!!isHovered || !!isFocused" to vts-dropdown__content--visible or --hidden

What do you think?

@AustinGil
Copy link
Owner

Yeah, thanks. That's not a bad idea, but I would like to hear a bit more about your arguments for using a hidden class rather than removing it from the DOM.

@nyambe
Copy link
Author

nyambe commented Mar 6, 2020

Yeah, thanks. That's not a bad idea, but I would like to hear a bit more about your arguments for using a hidden class rather than removing it from the DOM.

In my case there are 2 main reasons, but I can think of many more.

  1. NUXT. I am using nuxt. Dropdown items (links) need to be available for crawler and SEO reasons.
  2. The dropdown shows States (button) and cities (content and link). There is a hiccup when changing states, to much data I guess.

I already did the modification, it took me less than 5 minutes. I would take another 15 minutes to make an option. Just need to tie the actions to methods. When the css-only option is set to true then all you need to do is set isHover and isFocus to true (the class still changes)

As a side note, I gained @click to open dropdown and an open all default setting. Very handy (reasons 3&4)

on vts-dropdown
@mouseenter="onHover"
@mouseleave="onHover"
@focusout="onFocusout"

On button
@click="buttonClick"

added class to _content
${!isCssOnly ? 'hidden' : '' }

Really really simple
I can do a pull request if you like it.

Keep up the good work

@AustinGil
Copy link
Owner

Hey, PRs are always welcome. It will help me better understand what you're suggesting. I think you make some valid points, and I cant think of many reasons to keep it as it currently is.

However, rather than adding a class, I think a good approach is to replace the current implementation using v-if to v-show

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

No branches or pull requests

2 participants