React Native Navigator renderScene多次调用

Question

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

原来

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

然后在发出navigator.push({ name : "Route 2", index: 2 })我的组件的render()方法时,会调用它重新渲染Navigator,而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

renderListingsScene必须返回 JSX 代码。您必须<View>返回renderScene. 我认为它会重新渲染每个场景，因为您没有提供任何组件作为返回值。