0

我正在编写一个带有离子反应的移动应用程序,它几乎完成了。但是我发现了一个这样的错误。在我的 Android 设备上测试应用程序时,我做了这样的事情,这里有问题。

  • 我单击主页选项卡并转到主页。然后我又点击了主页标签 3 次。
  • 当我按下设备上的返回按钮时,它会将我重定向回主页。

如何修复此错误?我搜索了很多,但找不到它。

<IonReactRouter>
  <IonTabs>
    <IonRouterOutlet>
      <Route path="/" render={() => <Redirect to="/home" />} exact/>
      <Route path="/search" component={SearchScreen} exact />
      <Route path="/profile" exact component={ProfileScreen} />
    </IonRouterOutlet>
    <IonTabBar className="tab-bar-box" slot="bottom">
      <IonTabButton
        className="tab-button"
        tab="tab1"
        href="/home">
        <div className="tab-bar-item feed" />
        <IonLabel>{strings.tabs.feed}</IonLabel>
      </IonTabButton>
      <IonTabButton
        className="tab-button"
        tab="tab4"
        href="/search">
        <div className="tab-bar-item search" />
        <IonLabel>{strings.tabs.search}</IonLabel>
      </IonTabButton>
      <IonTabButton
        className="tab-button"
        tab="tab5"
        href="/profile">
        <div className="tab-bar-item profile" />
        <IonLabel>{strings.tabs.profile}</IonLabel>
      </IonTabButton>
    </IonTabBar>
  </IonTabs>
</IonReactRouter>

从现在开始谢谢你。

4

1 回答 1

0

最好通过 useHistory 进行导航。这听起来是单页应用程序。也许你的问题会得到解决:

const history = useHistory(); // import it.
...
      <IonTabButton
        className="tab-button"
        tab="tab1"
      onClick={()=>  history.push("home")}>
        <div className="tab-bar-item feed" />
        <IonLabel>{strings.tabs.feed}</IonLabel>
      </IonTabButton>
//and other buttons as the same way
于 2020-12-14T13:20:45.953 回答