reactjs - 3 レベル低いコンポーネントの参照を取得するには?

Question

私は<canvas>それが必要な理由です、私はそれが通常においがすることを知っていますが、この場合はそうではありません.

私はコンポーネントツリーを持っています:

<A>
  <B>
    <C>
     <D/>
    </C>
  </B>
</A>

これだけがコンポーネントに分割されます。

<D>コンポーネント内のコンポーネントの参照を取得するにはどうすればよい<A>ですか?

何かのようなもの：

// i use class components, it just for example
class A extends React.Component {
  refD = React.createRef<D>();

  componentDidMount() { 
    // do something with refD
  }

  render() { return <B innerRef={innerRef} />; }
}

const B = ({ innerRef }) => <C innerRef={innerRef} />;
const C = ({ innerRef }) => <D ref={innerRef} />;
const D = () => <div>yep, i'm just div</div>;

を使用forwardRefしましたが、1 レベルしか機能しません