Logic Primitives

If and Loop


The If logic primitive allows you to render children components conditionally.
In the video above, I created a Card component that renders additional information based on the component's state. The If logic is also great for rendering components based on logged-in users, different UI per screen size, and more.


The Loop logic primitive works like the JavaScript Array map() method but better because you get a visual tool to help work with the method and select values returned from the callback method.
Using the Loop primitive is great for rendering multiple components based on an array you are passing to it.
The video above provides an example of rendering multiple UI components based on the array of items passed to the Loop items property.