Show & For in SolidJS
From the SolidJS cheat sheet · Control Flow · verified Jul 2026
Show & For
Conditionally render with Show and efficiently iterate lists with For.
tsx
// Quick Reference
import { Show, For } from "solid-js";
<Show when={loggedIn()} fallback={<Login />}>
<Dashboard />
</Show>
<For each={items()}>{(item) => <li>{item.name}</li>}</For>💡 Show renders children when the "when" prop is truthy, fallback otherwise
⚡ For is keyed by reference — each item maintains its own DOM nodes across updates
📌 In For, the item is a plain value but the index is a signal — call index() to read it
🟢 Use For for arrays of objects, Index for arrays of primitives
showforconditionallist