I added a display property to a label component, and when I changed the property value to ‘none’, no change occurred.
The display property works on the markdown component as well as a flex container with the label inside it. Is there a way to use the display property within a label component directly? I am using version 8.1.0.
Why are you manually setting the display property in style configuration? There should be an equivalent property in the position section of the component’s configuration (if using a flex-based container).
My goal is to bind the display property to the selected valued of a dropdown component. If option 1 was selected, the user would be able to see the label and button (see image below).
If option 2 was selected, the label and button would not show.
I would use the visibility property, but the components below the toggled components would be spaced out when I would actually want them to collapse. Currently the display property bind seems to only work on the button component (using the property in the style configuration).
position.display = false will emit display: none in the component’s CSS and thus ‘collapse’ it in the layout - that’s exactly what the display position prop was added to do.
I apologize - I have my label component in a column container which I believe is why the display property is not working. I see the position.display property for a label component if I’m wrapped in a flex component, though not if I am in a column container. Is there a workaround to toggle display directly for a label component in a non-flex container, or do I have to have it wrapped?
meta.visible should be set to false if you're in a Column Container. If your concern here is that this doesn't result in the components "collapsing", then you need to look into using nested containers. A Column container will not collapse like you're looking for.
