I’ve seen the conditional display video, but can’t find the functionality in the editor. If its already launched, where do I find it, and if not launched, anyone know the ETA to live in production?
It’s in the settings tab of the element, the last option.
3 Likes
Adding onto @dorilama, there’s a couple ways to do conditional display. See the attached screenshots. Both are based on true/false values so just make sure your condition returns a true/false.
1 Like
Thanks! Much appreciated!
Keep in mind that the first solution is equivalent to a display: none in CSS, when the second option doesn’t render the element at all.
Use the second option if your element is dynamic or big, as not rendering it will give your app better performances.
1 Like
That is good to know—thank you for clarifying!
I have 2 sections whose data are bound to the exact same Collection. I want to display one of them on phone, and the other on Desktop and tablet. If I use the first method to hide one based on context, will I suffer a performance hit? I’m guessing no because both sections call exactly the same Xano API via a weweb Collection?
You’ll have a performance issue if the collection is big, not because of API calls, but because you’ll still render both sections internally.
By using conditional rendering instead, you’ll solve this issue (you can totally do it based on breakpoints)
1 Like