onsen react navigator pushpage 覆盖最后一页

Question

在一个项目中，我的意图是只使用一个 Navigator 元素来处理所有页面导航。

代码中有一个单例 appState，navigator 是其中的一员，它由最外层的 App 组件初始化。

ReactDOM.render(
   <App/>,
   document.getElementById('app')
 );

导航器由以下人员启动：

initialRoute = {
  component: LoginPage,
  props: {
}};

和

<Ons.Navigator
  initialRoute={this.initialRoute}
  renderPage={this.renderPage.bind(this)}
/>

和

renderPage(route: Route, navigator: typeof Ons.Navigator) {
  const props: any = route.props || {};
  if (appState.navigator == null) {
    appState.navigator = navigator;
  }
  props.navigator = appState.navigator;
  return React.createElement(route.component, route.props);
}

与 initialRoute 正确。当我调用 pushPage(newRoute) 时，newRoute 显然已添加，在添加时进行了检查。也就是说，我在按下 newRoute:

后得到以下正确信息

LoginPage
HomePage

但是，对 pushPage(someOtherRoute) 的后续调用会产生

LoginPage
SomeOtherRouteComponent

我希望

LoginPage
HomePage
SomeOtherRouteComponent

我已验证同步等方面没有问题，当我将路由对象推送到旁白列表时，我得到了所有内容而没有任何损失。但是 pushPage 并没有像我预期的那样工作。

有什么想法，或者遗漏了一些明显的东西吗？片段是 TS。

Answer 1

似乎 Navigator 捕获了页面加载期间的任何错误，这导致页面未添加到路由中（但页面仍被导航到）。

我已经在 github 上提交了一份 issue 的解决方法。另一种解决方法是确保在页面加载期间没有 JS 错误，这可能不是 100% 存在第 3 方模块的情况。

onsen react navigator pushpage 覆盖最后一页

onsen react navigator pushpage overwrites last page

reactjs

onsen-ui

onsen-ui2