title: About this.state function in React Native App
body: <p><strong>Hello this is my code. When I try to fill the text box then the error come i.e. ('this.setState is not a function.(In this.setState({emal:email)} this.setState is underfined').</strong></p>
  
  <p><strong>Here is my code:</strong></p>
  
  <p>import React from 'react';
  import {
    Image,
    Platform,
    ScrollView,
    StyleSheet,
    Text,
    TouchableOpacity,
    View,
    TextInput,
    TouchableHighlight,
    Alert,</p>
  
  <p>} from 'react-native';</p>
  
  <p>export default function LoginScreen() {</p>
  
  <pre><code>  onClickListener = (viewId) =&gt; {
      Alert.alert("Alert", "You can't "+viewId);
    }
  </code></pre>
  
  <p>return (
      
        
          https://png.icons8.com/message/ultraviolet/50/3498db'}}/>
           this.setState({email})}/>
        </p>
  
  <pre><code>  &lt;View style={styles.inputContainer}&gt;
      &lt;Image style={styles.inputIcon} source={{uri: 'https://png.icons8.com/key-2/ultraviolet/50/3498db'}}/&gt;
      &lt;TextInput style={styles.inputs}
          placeholder="Password"
          secureTextEntry={true}
          underlineColorAndroid='transparent'
          onChangeText={(password) =&gt; this.setState({password})}/&gt;
    &lt;/View&gt;
  
    &lt;TouchableHighlight style={[styles.buttonContainer, styles.loginButton]} onPress={() =&gt; this.onClickListener('login')}&gt;
      &lt;Text style={styles.loginText}&gt;Login&lt;/Text&gt;
    &lt;/TouchableHighlight&gt;
  
    &lt;TouchableHighlight style={styles.buttonContainer} onPress={() =&gt; this.onClickListener('restore_password')}&gt;
        &lt;Text&gt;Forgot your password?&lt;/Text&gt;
    &lt;/TouchableHighlight&gt;
  
    &lt;TouchableHighlight style={styles.buttonContainer} onPress={() =&gt; this.onClickListener('register')}&gt;
        &lt;Text&gt;Register&lt;/Text&gt;
    &lt;/TouchableHighlight&gt;
  &lt;/View&gt;
  </code></pre>
  
  <p>);
  }</p>
  
  <pre><code>const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#DCDCDC',
  },
  inputContainer: {
      borderBottomColor: '#F5FCFF',
      backgroundColor: '#FFFFFF',
      borderRadius:30,
      borderBottomWidth: 1,
      width:250,
      height:45,
      marginBottom:20,
      flexDirection: 'row',
      alignItems:'center'
  },
  inputs:{
      height:45,
      marginLeft:16,
      borderBottomColor: '#FFFFFF',
      flex:1,
  },
  inputIcon:{
    width:30,
    height:30,
    marginLeft:15,
    justifyContent: 'center'
  },
  buttonContainer: {
    height:45,
    flexDirection: 'row',
    justifyContent: 'center',
    alignItems: 'center',
    marginBottom:20,
    width:250,
    borderRadius:30,
  },
  loginButton: {
    backgroundColor: "#00b5ec",
  },
  loginText: {
    color: 'white',
  }
  });
  </code></pre>