Question

如果我有一个有两个视图的导航器：

  _renderScene(route, navigator) {
    if (route.id === 1) {
      return <PageOne navigator={navigator}
                         setIndex={this.setIndex} />
    } else if (route.id === 2) {
      return <PageTwo navigator={navigator}
                      index={this.state.index} />
    }
  }

当我在PageOne上时，我想开始预装PageTwo。是否有一种简单的方法来处理此异步加载，以便在用户单击导航时页面就绪？

想象一下第一页是滚动视图，第二页是图像列表，因此您希望在滚动到选项卡后立即开始加载view2的图像列表。这样，当您选择选项卡时，它将开始加载相关视图。

对我来说真正的困惑是如何开始在后台加载页面？

Answer 1

我最初会在此组件的构造函数中创建PageOne和PageTwo，然后在渲染中传递相关的一个。

类似的东西：

_initComponent() { //to call on constructor, or right after component mounted, or when props changed. make sure this does only run once in the component lifetime.
    this.page1 = <PageOne navigator={navigator}
                         setIndex={this.setIndex} />
    this.page2 = <PageTwo navigator={navigator}
                      index={this.state.index} />
}

_renderScene(route, navigator) {
    if (route.id === 1) {
      return this.page1
    } else if (route.id === 2) {
      return this.page2
    }
  }

React Native中的异步加载

1 个答案: