Tengo un componente de reacción simple con la forma que creo que tiene una entrada controlada:
import React from 'react';
export default class MyForm extends React.Component {
constructor(props) {
super(props);
this.state = {}
}
render() {
return (
<form className="add-support-staff-form">
<input name="name" type="text" value={this.state.name} onChange={this.onFieldChange('name').bind(this)}/>
</form>
)
}
onFieldChange(fieldName) {
return function (event) {
this.setState({[fieldName]: event.target.value});
}
}
}
export default MyForm;
Cuando ejecuto mi aplicación, aparece la siguiente advertencia:
Advertencia: MyForm está cambiando una entrada no controlada de texto de tipo para controlar. Los elementos de entrada no deben cambiar de no controlado a controlado (o viceversa). Decida entre usar un elemento de entrada controlado o no controlado durante la vida útil del componente
Creo que mi entrada está controlada ya que tiene un valor. Me pregunto qué estoy haciendo mal.
Estoy usando React 15.1.0