内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用
主app类呈现导航器和内部。renderScene
返回传递的组件:
class App extends React.Component { render() { return ( <Navigator initialRoute={{name: 'WelcomeView', component: WelcomeView}} configureScene={() => { return Navigator.SceneConfigs.FloatFromRight; }} renderScene={(route, navigator) => { // count the number of func calls console.log(route, navigator); if (route.component) { return React.createElement(route.component, { navigator }); } }} /> ); } }
目前,应用程序包含两个视图:
class FeedView extends React.Component { render() { return ( <View style={styles.container}> <Text> Feed View! </Text> </View> ); } } class WelcomeView extends React.Component { onPressFeed() { this.props.navigator.push({ name: 'FeedView', component: FeedView }); } render() { return ( <View style={styles.container}> <Text style={styles.welcome}> Welcome View! </Text> <Text onPress={this.onPressFeed.bind(this)}> Go to feed! </Text> </View> ); } }
我想知道的是
renderScene
被多次调用,但视图只正确呈现一次。动画是怎么工作的?
.ios.js:57个对象{name:‘WelcomView’,Component:Function}index.ios.js:57个对象{name:‘FeedView’,组件:function}//呈现源视图你的方法应该很有效。在FB的大型应用程序中,我们避免调用require()
对于场景组件,直到我们呈现它,这可以节省一点启动时间。
该renderScene
当场景第一次被推送到Navigator时,应该调用这个函数。当Navigator重新呈现时,它也将被调用为活动场景。如果你看到renderScene
之后多次被调用。push
可能是个小虫子。
Navigator
现在被废弃了RN 0.44.0
你可以用react-native-deprecated-custom-components
相反,支持正在使用的现有应用程序。Navigator
。