react-native - 多次调用 React Native Navigator renderScene

Question

我已经被 RN Navigator 难住了一段时间，试图弄清楚为什么 Navigator 渲染所有推送到其堆栈中的路由。

最初

<Navigator initialRoute={{name:"Route 1", index: 1}} />

然后在发出 navigator.push({ name : "Route 2", index: 2 })我的组件的 render() 方法被调用，它重新渲染 Navigator，后者又调用 renderScene .

推送第二条路线并在调用 renderScene 时记录路线后，将产生以下结果:

Render() --> renderScene(), {name:"Route 1", index: 1}

Render() --> renderScene(), {name:"Route 2", index: 2}

有谁知道为什么 renderScene() 被调用的次数与导航器堆栈中的路由一样多？这是预期的行为，如果是，我们如何加快渲染速度？

在最终渲染最后推送的路线的场景之前尝试渲染 5 条路线的场景时，性能会受到显着影响，而实际上它应该调用 render() 一次以仅渲染最后推送的路线的场景。

任何帮助是极大的赞赏。
谢谢!

这些是相关的片段:

nav.js

export function ListPage(){
    return {
        name: LIST_PAGE,
        index: 1
    }
}


Main App

<Navigator
        ref={(ref) => this.navigator = navigator = ref}
        initialRoute={nav.ListPage()}
        renderScene={(route,navigator)=>this.renderListingsScene(route,navigator)}
 />

renderListingsScene(route, navigator){
        console.log("renderScene()", route);

}

Answer 1

我有一个类似的问题(它正在调用我在启动时定义的所有路由)。
一旦我删除了 initialRouteStack来自 Navigator它停止发生的属性。

<Navigator
          initialRoute={routes[0]}
          //initialRouteStack={routes}
          renderScene={ (route, navigator) => this._renderScene(route, navigator) }
/>