Refs & Forwarding in SolidJS

From the SolidJS cheat sheet · Refs & DOM Access · verified Jul 2026

Get direct access to DOM elements using ref and forward refs to parent components.

tsx

// Quick Reference
let inputRef!: HTMLInputElement;
<input ref={inputRef} />
// Or with callback: <input ref={(el) => doSomething(el)} />

💡 Use the ! (definite assignment) operator since refs are assigned after render

⚡ Callback refs run immediately when the element is created — useful for canvas setup

📌 Access refs in onMount, not in the component body — the element may not exist yet

🟢 Forward refs by passing them as regular props — no special forwardRef API needed

refsdomelements