Hide conditional component from DOM

Hi, it’s me again. Sorry for all these questions, I’m learning this framework and have to say there are sometimes not a lot of good google results for the newer vaadin versions so I’m asking here instead.

I’ve a component (just a div with some text) which is conditionally shown/hidden based on an boolean which can change.
Currently I’m adding the component during view creating and using setVisible. Using this way the component remains in the DOM and is just hidden with css. Is there a way to hide it from the dom too but add it back to a specific position when it should be shown?

You can remove it and add it again ( remove from the parent). But you need to add it to the correct position.

For a div with some text, I would probably hide the div and maybe clear the text. ( And show it and set the text)

yeah so I always need to have an empty container at the position i want to add it back at, right? There is no good way of adding it back to an exact position without it

The interface HasComponents (implemented inDiv, Vertical/HorizontalLayout) has this method: addComponentAtIndex

So there is a good way to add a component in the exact position.

Yeah but that way I need to count indexes?

Convinience methods would be nice like addBefore(component) and addAfter(component)

I guess i can get the index of a previous component also but still not really nice for me as you need to know how the counter works for this (how are components inside of components counted, again starting from 0?)

You can also create a ticket on github to ask convenience methods

Will do maybe, thank you :slightly_smiling_face:

https://github.com/vaadin/flow/issues/17191