use:ref

use:ref is an attribute that hands you a reference to the element via a signal. Accept a function that receives the signal, or an array of such functions when you need more than one consumer. Call the signal to read the ref — ref() — so it works inside effects and memos.

The ref is written as soon as the element is created, before its children exist and before it is inserted into the document. Layout-dependent properties like clientWidth therefore return 0 at ref time. For values that need the element to be connected, see the Mounted Ref example below — it combines use:ref with use:connected.