Ask - Routen in nativer App Intro Reagieren

Question

Also mit dieser Komponente spiele ich um: react-native-app-intro

Hier ist meine Codes (index.ios.js):

import React, { Component } from 'react'; 
import { AppRegistry, Alert } from 'react-native'; 
import AppIntro from 'react-native-app-intro'; 

import Main from './main'; 


class coba_reactIntro extends Component { 
    onSkipBtnHandle = (index) => { 
    Alert.alert('Skip'); 
    console.log(index); 
    } 
    doneBtnHandle =() => { 
    Alert.alert('Done!'); 

    } 
    nextBtnHandle = (index) => { 
    Alert.alert('Next'); 
    console.log(index); 
    } 
    onSlideChangeHandle = (index, total) => { 
    console.log(index, total); 
    } 
    render() { 
    const pageArray = [{ 
     title: 'Page 1', 
     description: 'Description 1', 
     imgStyle: { 
     height: 80 * 2.5, 
     width: 109 * 2.5, 
     }, 
     backgroundColor: '#fa931d', 
     fontColor: '#fff', 
     level: 10, 
    }, { 
     title: 'Page 2', 
     description: 'Description 2', 
     imgStyle: { 
     height: 93 * 2.5, 
     width: 103 * 2.5, 
     }, 
     backgroundColor: '#a4b602', 
     fontColor: '#fff', 
     level: 10, 
    }]; 
    return (
     <AppIntro 
     onNextBtnClick={this.nextBtnHandle} 
     onDoneBtnClick={this.doneBtnHandle} 
     onSkipBtnClick={this.onSkipBtnHandle} 
     onSlideChange={this.onSlideChangeHandle} 
     pageArray={pageArray} 
     /> 
    ); 
    } 
} 

AppRegistry.registerComponent('coba_reactIntro',() => coba_reactIntro); 

Hier ist das Ergebnis von Simulator :

Und das ist mein main.js

import React, { Component } from 'react'; 
import { 
    View, 
    Text, 
    TextInput, 
    TouchableOpacity, 
    StyleSheet 
} from 'react-native'; 

const styles = StyleSheet.create({ 
    container:{ 
    flex: 1, 
    justifyContent: 'center', 
    alignItems: 'center', 
    padding: 40 
    }, 
    button:{ 
    textAlign: 'center' 
    }, 
}); 


module.exports = React.createClass({ 
    render(){ 
    return(
     <View style={styles.container}> 
      <Text style={styles.button}>Hello</Text> 
     </View> 
     </View> 
    ) 
    } 
}) 

Ich möchte verdrahten, wenn Benutzer klicken Knopf Fertig (Img: rote Markierungen), wird die Seite zu meinem main.js
Wie kann ich es in React Native?
Sorry für diese Noob Frage

Answer 1

Wenn Sie nur für iOS verwenden möchten Sie die navigatorIOS (https://facebook.github.io/react-native/docs/navigatorios.html)

Oder Sie nutzen den Router Fluss für die Navigation (dieses in den meisten verwende ich verwenden können, meine Projekte) https://github.com/aksonov/react-native-router-flux

So können Sie so etwas wie verwenden:

export default class PageOne extends Component { 
    render() { 
    return (
     <Text onPress={Actions.pageTwo}>This is PageOne!</Text> 
    ) 
    } 
} 

Wirklich einfache Anleitung, wie man es benutzt:

https://github.com/aksonov/react-native-router-flux/blob/master/docs/MINI_TUTORIAL.md

Hoffnung das ist, was Sie für :)