我正在尝试制作一个带有2个面板的应用程序,一个带有我的用户输入,另一个带有输出(它是所有日期,并不重要)。 我正在使用导航仪。我的“主要”课程是:
export default class App extends Component {
onDateChange = (state) => (event,value) => {
this.setState({
[state]:value
});
}
render () {
return (
<Navigator
initialRoute={{id: 'mainPage', name: 'main'}}
renderScene={this.renderScene.bind(this)}
configureScene={(route) => {
if (route.sceneConfig) {
return route.sceneConfig
}
return Navigator.SceneConfigs.VerticalDownSwipeJump;
}}/>
);
}
renderScene ( route, navigator ) {
var routeId = route.id;
if (routeId === 'mainPage') {
return (
<mainPage
navigator={navigator}/>
);
}
if (routeId === 'calcPage') {
return (
<calcPage
navigator={navigator}/>
);
}
}
}
它加载的第一页看起来像:
class mainPage extends Component {
componentWillMount () {
var navigator = this.props.navigator;
}
constructor(props) {
super(props)
this.state = {
dayMes: "",
monthMes: "",
yearMes: "",
dayLast: "",
monthLast: "",
yearLast: "",
dayInit: "",
monthInit: "",
yearInit: "",
}
}
render() {
return (
<ScrollView>
<View style={{
justifyContent: 'center',
}}>
<View style={{
height: 40,
justifyContent: 'center',
borderTopWidth: 25,
backgroundColor: 'white'
}}/>
</View>
LOTS of textInputs ...
<TouchableOpacity onPress={ () => { navigator.replace({ id: 'calcPage' }); } }>
<View style={styles.button}>
<Text style={styles.buttonText}>Calculer</Text>
</View>
</TouchableOpacity>
</View>
</ScrollView>
)
}
}
当我按下按钮时,它会给我一个错误undefined is not a function (evaluating 'navigator.replace({id: 'calcPage'})')
。我猜问题是它触发的功能,但我不知道在哪里。 calcPage类与第一个类相同,因为我还在测试。
感谢您的帮助!
编辑:
import React, {Component} from 'react';
import DatePicker from 'react-native-datepicker';
import { AppRegistry, View, Image, Text, TextInput, StyleSheet, Alert, Button, TouchableOpacity, ScrollView, Navigator } from 'react-native';
我的进口