reactjs - React Ionic 5: App コンポーネントから Tab コンポーネントにオブジェクトを渡す方法

Question

Ionic 5 タブ テンプレートを使用して Ionic React アプリを作成しました。

App コンポーネントからタブ コンポーネントにオブジェクトを渡したい。

それを行う方法はありますか？

Tab1 と Tab2 は、私のタブ コンポーネントです。

注:このオブジェクトを両方のタブ コンポーネントで双方向のデータ バインディングで使用する必要があります。つまり、そのオブジェクトが 1 つのタブ コンポーネントで変更されるたびに、2 番目のタブ コンポーネントで更新する必要があります。Redux またはサード パーティを使用せずにそれを実現したい図書館。

私のアプリコンポーネントは以下のようなものです:

<IonApp>
    <IonReactRouter>
      <IonTabs>
        <IonRouterOutlet>
            <Route path="/tab1"
                    component=Tab1
                    exact={true} />
            <Route path="/tab2"
                    component=Tab2
                    exact={true} />
          <Route path="/" render={() => <Redirect to="/tab1" />} exact={true} />
        </IonRouterOutlet>
        <IonTabBar slot="bottom">
            <IonTabButton tab={"Title1"} href={"/tab1"}>
              <IonIcon icon={settings} />
              <IonLabel>{"Title1"}</IonLabel>
            </IonTabButton>
            <IonTabButton tab={"Title2"} href={"/tab2"}>
              <IonIcon icon={settings} />
              <IonLabel>{"Title2"}</IonLabel>
            </IonTabButton>
        </IonTabBar>
      </IonTabs>
  </IonReactRouter>
</IonApp>