Soy nuevo en React, pero no en programación. En el siguiente código, desc nunca cambia de estado, y creo que esto se debe a que la etiqueta no es completamente compatible con el valor y el controlador de evento/atributo onChange que estoy tratando de usar con él.

Lo que intento hacer es obtener la información de texto de la etiqueta span cuando presiona el botón className='submit'. Vi algunos videos en los que la gente sugería el método que tengo implementado ahora, donde constantemente actualizas el estado en Cambiar, sin embargo, esto me parece tonto y si hay una mejor manera en la que obtienes el texto solo en Hacer clic una vez en lugar de actualizar constantemente, por favor deja yo sé.

Además, estoy usando un lapso con el atributo contentEditable debido a razones de estilo CSS, quiero un cuadro sin bordes que se expanda y el contenedor esté adentro en lugar de que el texto salga de la página a la derecha. Adjunto una captura de pantalla de lo que quiero decir.

 const [title, setTitle] = useState(''); const [desc, setDesc] = useState(''); return ( <div className='card-container'> <div className='card'> <h1 className='card-title'> <input className='titletext' value={title} onChange={e => setTitle(e.currentTarget.value)} placeholder='Who do you need?'></input> </h1> <p className='card-desc'> <span className='textarea' value={desc} onChange={e => setDesc(e.currentTarget.value)} contentEditable></span> </p> <button className='submit' onClick={event => { /* Add job to the database (async) Add new card with information submitted in the list right below */ event.preventDefault(); console.log(title); console.log(desc); }}></button> </div> </div> ); }