app/components/Home.js 页面代码如下：

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

import {Actions} from 'react-native-router-flux';

export default class Home extends Component {
state = {
name: '',
};

render() {
return (
<View style={styles.container}>
<Text style={styles.title}>
Enter your name:
</Text>
<TextInput
underlineColorAndroid='rgba(0,0)'
style={styles.nameInput}
placeholder='James Smith'
onChangeText={(text) => {
this.setState({
name: text,
});

}}
value={this.state.name}
/>
<TouchableOpacity style={styles.button}
onPress={() => Actions.chat(
{param1: this.state.name,param2: 'Welcome to my room'}
)}
>
<Text style={styles.buttonText}>Submit</Text>
</TouchableOpacity>
</View>
);
}
}

const styles = StyleSheet.create({
container: {
flexGrow: 1,
alignItems: 'flex-start',
marginLeft: 20,
},
title: {
marginTop: 20,
fontSize: 20,
fontWeight: 'bold',
nameInput: {
width:300,
height: 45,
fontSize:16,
borderWidth: 2,
borderColor: 'black',
marginTop: 10,
marginBottom: 20,
button: {
height: 40,
width: 200,
borderRadius: 20,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#3498db',
buttonText: {
fontSize: 16,
color: 'white',
});

app/components/Chat.js 页面代码如下：

import React,
View
} from 'react-native';

export default class Chat extends Component {
render() {
return (
<View style={{ flex: 1,backgroundColor: 'black' }}>
<Text style={{ fontSize : 20,color: 'green'}}>
{this.props.param1 }: {this.props.param2 }
</Text>
</View>
);
}
}

App.js 页面代码如下：

import React,
View
} from 'react-native';

import Home from './app/components/Home';
import Chat from './app/components/Chat';

import {Router,Scene,Stack } from 'react-native-router-flux';

export default class App extends Component {
render() {
return (
<Router>
<Stack key='root' style={{paddingTop: 64}}>
<Scene key='home' component={Home} title='Home' />
<Scene key='chat' component={Chat} title='Chat' />
</Stack>
</Router>
);
}

}

注意本范例你需要安装react-native-router-flux组件，安装命令如下：

cd ChatApp && yarn add react-native-router-flux