反應如何在我的組件中從 html 訪問孩子？

Question

我想創建一個覆蓋菜單反應組件。 我想創建一個呈現菜單打開按鈕的組件。

菜單是在服務器端創建的，所以我需要選擇子項將它們添加到我的組件中。 我嘗試過這樣的事情，但這當然沒有用。 我的問題的最佳做法是什么？

<div id="menu-btn">
  <ul>
    <nav class="overlay-navigation">
      <ul>
        <li><a href="#">a</a></li>
        <li><a href="#">b</a></li>
        <li><a href="#">c</a></li>
      </ul>
    </nav>
  </ul>
</div>

render() {
        return (
            <>
            <a data-menuopen={ !this.state.open } onClick={ () => this.setState( { open: !this.state.open } ) } href="#" class="menu-btn">
                { !this.state.open ? <img class="svg" src="data/images/menu.svg" /> : "" }
                { this.state.open ? <img class="svg" src="data/images/close.svg" /> : "" }
            </a>

            <Portal>
                <div className="overlay-menu">
                    { this.props.children }
                </div>
            </Portal>
            </>
        );
    }