import React from 'react'; class InfoForm extends React.Component { constructor() { super(); this.state={ _id:'', Name:'', Age:'', isEdit:false } } infoChange = event =>{ const {name,value} = event.target; this.setState({ [name]:value }) } infoSubmit = event => { if(!this.state.isEdit){ let data = { isEdit:this.state.isEdit, Name:this.state.Name, Age:this.state.Age } this.props.myData(data); } else{ let data = { isEdit:this.state.isEdit, _id:this.state._id, Name:this.state.Name, Age:this.state.Age } this.props.myData(data); } } static getDerivedStateFromProps(props, state) { if(props.setForm._id !== null) { return{ isEdit:true, _id : props.setForm._id, Name:props.setForm.Name, Age:props.setForm.Age } } return null } render() { return ( <form onSubmit={this.infoSubmit} autoComplete="off"> <div className="form-group"> <label>Email Name:</label> <input type="text" className="form-control" placeholder="Enter Name" onChange={this.infoChange} name="Name" value={this.state.Name} /> </div> <div className="form-group"> <label>Email Age:</label> <input type="text" className="form-control" placeholder="Enter Age" onChange={this.infoChange} name="Age" value={this.state.Age} /> </div> <button type="submit" className="btn btn-primary">{this.state.isEdit ? 'update': 'Submit'}</button> </form> ) } } export default InfoForm;

Las entradas de formulario no permitirán editar los valores. cuando hago clic en el botón, aparece este error "Advertencia: un componente está cambiando una entrada no controlada para ser controlada. Esto probablemente se deba a que el valor cambia de indefinido a un valor definido, lo que no debería suceder. Decida entre usar un elemento de entrada controlado o no controlado durante la vida útil del componente". por favor ayúdame soy nuevo para reaccionar.