Ich erkunde Möglichkeiten von Nativ reagieren während der Entwicklung einer Demo-App mit benutzerdefinierter Navigation zwischen Ansichten mit Hilfe von Navigator Komponente.
Die Haupt-App-Klasse rendert navigator und inside renderScene gibt bestandene Komponente zurück:
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 });
}
}}
/>
);
}
}
Im Moment enthält die App zwei Ansichten:
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>
);
}
}
Was ich herausfinden möchte ist:
-
Ich sehe in den Protokollen, dass beim Drücken von „Zum Feed gehen“
renderScenewird mehrmals aufgerufen, obwohl die Ansicht einmal korrekt gerendert wird. Funktioniert die Animation so?index.ios.js:57 Object {name: 'WelcomeView', component: function} index.ios.js:57 Object {name: 'FeedView', component: function} // renders Feed View -
Entspricht mein Ansatz im Allgemeinen dem React-Weg oder kann es besser gemacht werden?
Was ich erreichen möchte, ist etwas ähnliches NavigatorIOS aber ohne die Navigationsleiste (einige Ansichten haben jedoch ihre eigene benutzerdefinierte Navigationsleiste).
@ericvicenti Dieses Beispiel sollte in der enthalten sein Navigator-Seite in den Dokumenten. Es ist vollständiger und vermittelt ein besseres Bild davon, wie die Navigator-Komponente im Kontext verwendet wird.
– Greatwitenord
8. April 2016 um 14:13 Uhr
Wenn Sie nur Ihr Beispiel ausprobieren, sollte sich die Szene automatisch ändern, wenn ein Navigator-Push erfolgt? Für mich zeigt Ihr Beispiel nie die Feed-Ansicht! Text, daher frage ich mich, ob sich in den letzten Versionen etwas geändert hat.
– Jan
19. Dezember 2016 um 13:17 Uhr