React Native Navigator renderScene называется несколько раз

Я некоторое время был в тупике с RN Navigator, пытаясь понять, почему Navigator отображает все маршруты, вложенные в его стек.React Native Navigator renderScene называется несколько раз

Первоначально

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

Тогда при выдаче navigator.push({ name : "Route 2", index: 2 }) метод визуализации() моего компонента вызывается, который повторно предоставляет навигатор, который, в свою очередь, вызывает renderScene.

После нажатия на 2-й маршрут и протоколирование маршрут, когда renderScene вызывается, уступает:

Render() -> renderScene(), {имя: "Маршрут 1", индекс: 1}

Render() -> renderScene(), {имя: "Route 2", индекс: 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); 

}

источник

2016-09-16 DritanX

Вы можете поделиться тем, что на ваш взгляд "renderScene" на самом деле? Также ваш '' отсутствует пара фигурных скобок, он должен быть ' ' – rclai

Я обновил вопрос, чтобы отразить код, который вы ищете, и у меня есть скобки в моем коде - исправлена опечатка – DritanX

Да, это странно. У меня такая же проблема, но только с двумя маршрутами в 'initialRoute' (рендеринг 2x) и с помощью' navigationState', чтобы передать стек (но не нажимать на него) –

renderListingsScene должен возвращать код JSX. Вы должны вернуть <View> или другой компонент в свой renderScene. Я думаю, что он повторно отображает каждую сцену, потому что вы не предоставляете какой-либо компонент в качестве возвращаемого значения.

источник

2016-09-19 00:32:19 leo7r

У меня есть метод возврата JSX во всех случаях. В случае отсутствия данных я возвращаю компонент «пустой страницы» JSX – DritanX

У меня была аналогичная проблема (она вызывала все маршруты, которые я определил при запуске). Как только я удалил initialRouteStack из Navigator Свойства, они прекратились.

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

источник

2016-12-04 02:05:39 roocell

React Native Navigator renderScene называется несколько раз

ответ

Смежные вопросы