G
G
grv12017-09-21 17:03:56
React
grv1, 2017-09-21 17:03:56

How to fix Warning Input is changing an uncontrolled input of type text to be controlled?

There is an error how to fix it?

Warning: Input is changing an uncontrolled input of type text to be controlled. Input elements should not switch from uncontrolled to controlled (or vice versa). Decide between using a controlled or uncontrolled input element for the lifetime of the component. More info: https://fb.me/react-controlled-components

import React from 'react';
import createReactClass from 'create-react-class';

var Input = createReactClass({
    getDefaultProps() {
        return {
            classNames: 'input',
            value: '',
            onChange: function (event) {
                console.log(event, "don't set onChange");
            }
        };
    },
    getInitialState() {
        return {
            title: this.props.title,
        };
    },
    handleChange(event) {
        this.props.onChange(event);
        this.setState({value: event.target.value});
    },
    render() {
        return <div className={this.props.classNames}>
            <label>
                {this.state.title}
                <input type="text" value={this.state.value} onChange={this.handleChange} />
            </label>
        </div>;
    }
});

export {Input};

Answer the question

In order to leave comments, you need to log in

1 answer(s)
R
Roman Alexandrovich, 2017-09-21
@grv1

getInitialState() {
        return {
            title: this.props.title,
           value:"",
        };
    },

try like this

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question