Browse Source

feat: bind input values to logical YooLogin component

pull/1/head
kdxcxs 4 years ago
parent
commit
5a720434f9
  1. 28
      src/ui/YooLoginUI.js

28
src/ui/YooLoginUI.js

@ -45,18 +45,6 @@ const styles = StyleSheet.create({
}, },
}); });
function LoginInput(props) {
return props.type === 'username' ? (
<TextInput style={styles.input} placeholder={'账号'} maxLength={10} />
) : (
<TextInput
style={styles.input}
placeholder={'密码'}
secureTextEntry={true}
/>
);
}
export default class YooLoginUI extends Component { export default class YooLoginUI extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
@ -77,8 +65,20 @@ export default class YooLoginUI extends Component {
return ( return (
<View style={styles.container}> <View style={styles.container}>
<Image source={require('../../assets/icon.png')} style={styles.logo} /> <Image source={require('../../assets/icon.png')} style={styles.logo} />
<LoginInput type={'username'} /> <TextInput
<LoginInput type={'password'} /> style={styles.input}
placeholder={'账号'}
maxLength={10}
value={this.props.username}
onChangeText={(username) => this.props.setUsername(username)}
/>
<TextInput
style={styles.input}
placeholder={'密码'}
secureTextEntry={true}
value={this.props.password}
onChangeText={(password) => this.props.setPassword(password)}
/>
<TouchableOpacity style={styles.button} onPress={this.onButtonPress}> <TouchableOpacity style={styles.button} onPress={this.onButtonPress}>
{this.state.loading ? ( {this.state.loading ? (
<ActivityIndicator size="large" color="#00ff00" /> <ActivityIndicator size="large" color="#00ff00" />

Loading…
Cancel
Save