Access ref in child component when using forwarding refs

I would like to use a forwarding ref as described in https://docs.solidjs.com/concepts/refs#forwarding-refs but also access the ref in the child component itself, like:

// Child component
function Canvas(props) {
  let anotherRef // <-- how to assign this?
  onMount(() => anotherRef.addEventListener('click', ...))
  return (
    <div className="canvas-container">
      <canvas ref={props.ref} /> {/* Assign the ref to the canvas element */}
    </div>
  )

// Child component
function Canvas(props) {
  let anotherRef // <-- how to assign this?
  onMount(() => anotherRef.addEventListener('click', ...))
  return (
    <div className="canvas-container">
      <canvas ref={props.ref} /> {/* Assign the ref to the canvas element */}
    </div>
  )

Is it possible?

SolidJS•14mo ago•

5 replies

snorbi

Access ref in child component when using forwarding refs

I would like to use a forwarding ref as described in https://docs.solidjs.com/concepts/refs#forwarding-refs but also access the ref in the child component itself, like:

// Child component
function Canvas(props) {
  let anotherRef // <-- how to assign this?
  onMount(() => anotherRef.addEventListener('click', ...))
  return (
    <div className="canvas-container">
      <canvas ref={props.ref} /> {/* Assign the ref to the canvas element */}
    </div>
  )

// Child component
function Canvas(props) {
  let anotherRef // <-- how to assign this?
  onMount(() => anotherRef.addEventListener('click', ...))
  return (
    <div className="canvas-container">
      <canvas ref={props.ref} /> {/* Assign the ref to the canvas element */}
    </div>
  )

Is it possible?

Access ref in child component when using forwarding refs

Similar Threads

Access ref in child component when using forwarding refs

Similar Threads

Similar Threads

Similar Threads