Failed prop type: Invalid prop 'value'

Abdallah Sabri

Whenever I try o type into the TextInput I keep getting this warning: failed prop type invalid prop 'value' of type 'object' supplied to 'textinput' expected 'string'

LoginForm.js

import React, { Component } from 'react';
import { Card, CardSection, Button, Input } from './common';

class LoginForm extends Component {

    state = { email: '', password: '', error: '' };

    render() {
        return (
            <Card>
                <CardSection>
                    <Input 
                    label='Email'
                    placeholder='[email protected]'
                    value={this.state.email}
                    onChangeText={(email) => this.setState({ email: email } )}
                    />
                </CardSection>

Input.js

import React from 'react';
import { TextInput, View, Text } from 'react-native';

const Input = ({ label, value, onChangeText, placeholder, secureTextEntry }) => {
    return (
        <View style={styles.containerStyle}>
            <Text style={styles.labelStyle}>{ label }</Text>
                <TextInput
                secureTextEntry={secureTextEntry}
                placeholder={placeholder}
                style={styles.inputStyle}
                value={value}
                onChange={onChangeText}
                autoCorrect={false}
                />
        </View>
    );
};

Could you please help me to find the problem?

Hend El-Sahli

The event listener you need to bind is onChangeText

onChangeText expects a string param ... where onChange expects an object of this form: nativeEvent: { eventCount, target, text} ... that's why you're getting this error...

<Text style={styles.labelStyle}>{ label }</Text>
                <TextInput
                secureTextEntry={secureTextEntry}
                placeholder={placeholder}
                style={styles.inputStyle}
                value={value}
                onChangeText={onChangeText} // <--Look at this
                autoCorrect={false}
                />

Collected from the Internet

Please contact [email protected] to delete if infringement.