问React-Native，Redux，invariant

EN

import React, { Component } from "react";
import { connect } from "react-redux";
import { Text, View, TouchableOpacity, StyleSheet,Image ,TextInput,Button} from "react-native";
import Icon from 'react-native-vector-icons';
import { login } from "../Actions/actionCreator";

class LoginScreen extends Component {
  static navigationOptions = {
    title: "Login"
  };

  constructor(props){
      super(props);
      this.state = {
          username:'',
          password:''
      }
  }

  doLogin(username,password)
  {

  }

  render() {
    return (
      <View style={styles.rootContainer}>

          <Image
              style={styles.logo}
              source={require('/Users/apple/Desktop/redux-react-navigation-demos-authFlow/src/images/logo.png')}
          />

          <Icon
              name='user'
              color='#000'
              size={14}
          />

          <TextInput
              onChangeText={username => this.setState({ username })}
              value={this.state.username}
              style={styles.textInput}
              placeHolder="Username"
          />
          <TextInput
              onChangeText={password => this.setState({ password })}
              value={this.state.password}
              style={styles.textInput}
              placeHolder="Password"
          />

          <Text style={styles.textGreen}>Forget Your Password</Text>


          <Button
              onPress={() => {
                  this.doLogin(this.state.username, this.state.password)
              }}
              color="#ffffff"
              title="Sign In"
          >
            Sign In
      </Button>

      </View>
    );
  }
}

const styles = StyleSheet.create({
  rootContainer: {
    flex: 1,
    backgroundColor: "cyan",
    justifyContent: "center",
    alignItems: "center"
  },
  textStyles: {
    textAlign: "center",
    color: "rgba(0,0,0,0.8)",
    fontSize: 16
  },
  touchableStyles: {
    marginTop: 15,
    backgroundColor: "black",
    paddingHorizontal: 50,
    paddingVertical: 10,
    borderRadius: 5
  },
    textGreen: {
        textAlign:"center",
        fontSize:16,
        color:'#7dc4a6'
    },

    logo: {
        width: 587,
        height: 112
    },

    textInput: {
        borderColor:'black',
        backgroundColor:'#D3D3D3',
        width:300,
        borderWidth: 1,
        borderStyle: 'solid',
        fontSize:15,
        borderRadius: 25,
    }

});

const mapDispatchToProps = {
  login
};


const Login = connect(null, mapDispatchToProps)(LoginScreen);

export default Login;