如何在 Ionic React 中添加全局组件（导航）

Question

我正在尝试在我的 Ionic React 项目中添加一个全局 navigation/menu 栏组件，就像您在任何网站上所做的那样。

所以我创建了一个标准的 <Nav/> 组件 i React，但似乎我只能将它添加到我的 Ionic 应用程序的特定页面中，而不是在我的 App.tsx 文件中，路由器已设置。

我的 App.tsx 组件如下所示：

const App: React.FC = () => (
  <IonApp>
    <IonReactRouter>
      <IonRouterOutlet>
        <Route exact path="/" component={Home} />
        ...
      </IonRouterOutlet>
    </IonReactRouter>
  </IonApp>
);

我想将我的 <Nav/> 添加到 <IonReactRouter> 正下方的第 4 行，就像我通常在标准的 create-react-app 项目中所做的那样。

但如果我这样做，<Nav/> 不会呈现并且我不会收到任何错误。

这不可能吗？我需要在项目中的每个页面添加 <Nav/> 吗？

Answer 1

刚刚得到朋友的帮助。这个问题真的很傻...

问题只是我的 <Nav/> 组件需要更高的 z-index，由于某种原因它被放置在内容后面。