He escrito un código React simple que muestra una lista de Film. Nombre, imagen y valor "ocena", que debe ser editable. Pero, de hecho, no es editable. Sé más o menos sé por qué. Por el valor={ocena} durante la creación del elemento en lista.

 <input value ={ocena} type='number' />

Pero no tengo idea de cómo hacerlo realmente editable y cambiar dinámicamente el valor de ocena a medida que el usuario lo edita. Hay alguna manera ? Aquí está mi código:

 const Film = ({kk , nazwa, ocena,opis, setOcena,filmy}) => { console.log({kk}) return(<div className="film"> <img src={kk} width={'80px'} height={'80px'} /> <li className="film_item">{nazwa}</li> <textarea>{opis}</textarea> <input value ={ocena} type='number'/> <button className="delete">DELETE</button> </div> ) }

Y el lsit mismo

 const Filmlist = ({filmy, setOcena , ocena}) => { const [kk , setkk] = useState(filmy.url1); return( <div className="filmlist_container"> <ul className="filmlist"> {console.log(filmy)} {filmy.map((film)=> ( <Film setOcena={setOcena} nazwa ={film.nazwa} opis = {film.opis } ocena= {film.ocena }kk= {film.url1 } filmy={filmy}/> ))}; </ul> </div> ) }

¿Hay una manera simple, o debería volver a escribir mi código para que esto sea posible?