我正在用React做一个简单的“餐厅”页面作为学习项目。我的代码如下：

function App() {

  const [section, setSection] = useState('Home')

  const sections = {
    home: () => {
      setSection('Home')
    },
    specials: () => {
      setSection('Specials')
    },
    menu: () => {
      setSection('Menu')
    },
    contact: () => {
      setSection('Contact')
    }
  }

    return <>
      <div className='appContainer'>
        <div className='navBar'>
          <Menu sections={sections}/>
        </div>
        <div className='content'>
          <div className='contentBg'>
            <Content currentSection={section}/>
          </div>
        </div>
      </div>
    </>;
}

• sections* 是组件内部的按钮，OnClick调用setSection（）设置应该在内部呈现的部分。我将状态'section'作为prop传递，由内部函数检查。

function Content(props) {

    const activeSection = props.currentSection;
    
    const sectionSelector = () => {
        if (activeSection === 'Home')
            return <Home />
        if (activeSection === 'Specials')
            return <Specials />
    }

为什么不呈现sectionSelector（）中的内容？是因为在呈现的时候它还没有被返回吗？我应该改变代码的结构吗？
谢谢大家。