प्रतिक्रियात्मक नेविगेटर रेंडरसेन कई बार कहा जाता है

Question

मुझे थोड़ी देर के लिए रुक गया है कि आरएन नेविगेटर यह पता लगाने की कोशिश कर रहा है कि क्यों नेविगेटर अपने सभी ढेर में धक्का दिया गया है।

प्रारंभ में

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

फिर एक navigator.push({ name : "Route 2", index: 2 }) मेरी घटक की विधि प्रस्तुत करना() कहा जाता हो जाता है जो जारी करने पर फिर से renders नेविगेटर, जो बारी में कॉल renderScene।)> RenderScene (, -

प्रस्तुत() {नाम:: "रूट 1", सूचकांक: 1}

2 मार्ग को आगे बढ़ाने और मार्ग जब renderScene को पैदावार कहा जाता हो जाता है प्रवेश करने के बाद

प्रस्तुत() -> renderScene(), {नाम: "रूट 2", सूचकांक: 2}

क्या किसी को पता है कि क्यों renderScene() कई बार के रूप में कहा जाता है के रूप में वहाँ मार्गों के अंदर हैं नेविगेटर का ढेर? क्या यह व्यवहार की उम्मीद है और यदि यह है कि हम प्रतिपादन को कैसे बढ़ा सकते हैं?

आखिरकार धक्का दिया गया मार्ग के दृश्य को प्रस्तुत करने से पहले 5 मार्गों के दृश्य प्रस्तुत करने का प्रयास करते समय एक महत्वपूर्ण प्रदर्शन मारा गया है, जब वास्तव में इसे केवल अंतिम धक्का मार्ग के दृश्य को प्रस्तुत करने के लिए रेंडर() को कॉल करना चाहिए ।

किसी भी मदद की बहुत सराहना की जाती है। धन्यवाद!

ये प्रासंगिक के टुकड़े कर रहे हैं:

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 में एक अन्य घटक वापस करना होगा। मुझे लगता है कि यह हर दृश्य को फिर से प्रस्तुत करता है क्योंकि आप वापसी मूल्य के रूप में कोई घटक नहीं प्रदान कर रहे हैं।

Answer 2

मुझे एक ही समस्या थी (यह स्टार्टअप पर परिभाषित सभी मार्गों को कॉल कर रहा था)। Navigator गुणों से initialRouteStack हटा दिए जाने के बाद यह गुण बंद हो गया।

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