Skip to main content

useRefs

The useRefs hook allows components to access registered reference elements within a component. This is useful for interacting directly with elements assigned a d-ref identifier.

Syntax​

<p d-ref="text">Hello!</p>

Inside the component, useRefs() will return:

const refs = useRefs();
console.log(refs.text.textContent); // "Hello!"

Example​

Accessing and Interacting with Reference Elements​

<div>
  <input d-ref="inputBox" type="text" placeholder="Type here..." />
  <button @click="refs.inputBox.focus()">Focus Input</button>
</div>
const { useRefs } = DOMY;
DOMY.createApp(() => {
  const refs = useRefs();
  return {
    refs
  };
}).mount();