Как получить референцию в React (useRef)?

Question

[dc65k]

Всем привет, как правильно получить ссылку на ref?
Идея у меня такая, в компоненте App я получаю референцию из компонента 1, и эту ссылку на ноду прокидываю в компонент два.
Ниже моя не правильная реализация.
https://codepen.io/dc65k/pen/gOpNJVB

const { useRef } = React

const ComponentOne = (ref) => {
  return (
    <div ref={ref}>
      <div>ComponentOne</div>
    </div>
  )
}

const ComponentTwo = (node) => {
  console.log(node)
  return (
    <div>
      <div>ComponentTwo</div>
    </div>
  )
}

const App = () => {
  
  const node = useRef(null)
  
  return (
    <div>
      <ComponentOne ref={node}  />
      <ComponentTwo node={node} />
    </div>
  )
}

ReactDOM.render(
  <App />,
  document.getElementById('root')
)

Answer 1

[Mikhail Osher]

Оберните ComponentOne в forwardRef.

https://codesandbox.io/s/divine-architecture-9s9x7
https://reactjs.org/docs/forwarding-refs.html

Comments

[dc65k]

Спасибо за помощь.