Buenas tengo un problema con react me ocurre al poner el atributo value en el input no me permite escribir pero sin el tributo si puedo.

Pregunta de la clase:
Daniel Dante Cuevas Cuevas Cuevas

Daniel Dante Cuevas Cuevas Cuevas

Pregunta
student
hace 9 años

Buenas tengo un problema con react me ocurre al poner el atributo value en el input no me permite escribir pero sin el tributo si puedo.

2 respuestas
para escribir tu comentario
    Sergio Daniel Xalambrí

    Sergio Daniel Xalambrí

    student
    hace 9 años

    No es un problema, así funciona React, tenés que hacer que el value este conectado a un state de tu componente y que al dispararse el evento change cambias ese state entonces el valor que el usuario ve cambia, otra opción si solo querés un valor por defecto es usar defaultValue.
    En la documentación de React explican bien todo, con ejemplos de código.
    https://facebook.github.io/react/docs/forms.html

    Daniel Dante Cuevas Cuevas Cuevas

    Daniel Dante Cuevas Cuevas Cuevas

    student
    hace 9 años

    class ImgApp extends React.Component {

       render() {
          return <div>
             {
                this.props.images.map((image) => {
                   let url = `uploads/thumbnails/medium-${image.img}`;
                   let divStyle = {
                      backgroundImage: 'url('+url+')',
                      backgroundRepeat: 'no-repeat',
                      margin: "0 auto",
                   };
                   return <div key={uid()} className="text-center">
                         <div className="divMediumImg">
                            <div style={{position: 'absolute', marginTop: '-10px', marginLeft: '-10px'}}>
                               <button type="button" className="btn btn-default btn-xs">
                                  <i className="fa fa-times-circle fa-2x"></i>
                                </button>
                            </div>
                            <div style={divStyle} className="divMediumImg">
                            </div>
                         </div>
                         <input type="text" className="form-control images-msg" value={image.msg} />
                      <br/>
                   </div>
                })
             }
          </div>
       }
    }

Comunidad Platzi

Comunidad Platzi

Cada semana tenemos clases en vivo en las que los mejores estudiantes, invitados y miembros del team Platzi comparten su conocimiento con los demás.

Comunidad Platzi
Comunidad Platzi

Comunidad Platzi

Cada semana tenemos clases en vivo en las que los mejores estudiantes, invitados y miembros del team Platzi comparten su conocimiento con los demás.