我是React Native的新手并试图充实基本的前端。我有一个现有的节点服务器执行CRUD操作 - 现在我正在尝试充实一个家庭/登陆页面和可以从那里访问的注册页面。谢谢!
我在其他帖子中看到过这个问题,而且似乎通常是在课后定义这个StackNavigator的问题,但这不是我所做的。任何帮助将不胜感激。
/**
* Sample React Native App
* https://github.com/facebook/react-native
* @flow
*/
import {StackNavigator} from 'react-navigation';
import {t} from 'tcomb-form-native';
import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
View,
Button
} from 'react-native';
const App = StackNavigator({
Home: { screen: Home},
Signup: { screen: Signup},
});
var user = t.struct({
name: t.String,
username: t.String,
password: t.String,
email: t.String
});
var options = {};
export default class Home extends Component {
_signup(){
//goes to the signup screen
navigate('Signup')
}
render() {
return (
<View style={styles.container}>
<Text style={styles.welcome}>
Welcome to React Native!
</Text>
//this should move to a new screen which will render the signup form!
<Button style={styles.instructions}>
onPress={this._signup()}
title="sign up"
color="#841584"
accessibilityLabel="Sign up for my app"
</Button>
<Button style = {styles.instructions}>
onPress={}
title="view offers"
color="#841584"
accessibilityLabel="View offers on my app"
</Button>
<Text style={styles.instructions}>
Double tap R on your keyboard to reload,
Shake or press menu button for dev menu
</Text>
</View>
);
}
}
class Signup extends Component {
onPress(){
var value = this.refs.form.getValue();
console.log(value);
//todo: wire up fetch to perform verification on node server
}
render() {
return(
<View style={styles.container}>
<Form
ref="form" type={user} options={options}/>
<TouchableHighlight style={styles.button} onPress={this.onPress} underlayColor={'#99d9f4'}>
<Text style={styles.buttonText}>Submit</Text>
</TouchableHighlight>
</View>
)};
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
welcome: {
fontSize: 20,
textAlign: 'center',
margin: 10,
},
instructions: {
textAlign: 'center',
color: '#333333',
marginBottom: 5,
},
button: {
height: 36,
backgroundColor: '#48BBEC',
borderColor: '#48BBEC',
borderWidth: 1,
borderRadius: 8,
marginBottom: 10,
alignSelf: 'stretch',
justifyContent: 'center'
},
buttonText: {
fontSize: 18,
color: 'white',
alignSelf: 'center'
},
});
AppRegistry.registerComponent('Home', () => Home);
AppRegistry.registerComponent('Signup', () => Signup);
&#13;