Actualmente tengo este Code SandBox en el que intento que React-Quill y Quill-Comment trabajen juntos para permitir que los usuarios comenten el contenido que se ha escrito.

El comentario de Quill no es un paquete de reacción y soy un novato de reacción, así que no sé si lo que estoy tratando de hacer es posible. Parece funcionar parcialmente porque el botón Agregar comentario de la barra de herramientas registra el evento de clic.

 let commentCallback; function commentAddClick(callback) { setOpen(true); //show the modal commentCallback = callback; //Appears to do nothing? console.log("callback :>> ", callback); //Nothing is ever in the callback console.log("commentAddClick"); }

Sin embargo, el valor de devolución de llamada no parece tener ni hacer nada. Cuando hago clic en el botón Agregar comentario en el modal:

 const commentSave = () => { const comment = "This is a comment, forced for testing"; commentCallback(comment); console.log("comment :>> ", comment); //let comment = $('#commentInput').val(); commentCallback(comment); addCommentToList(comment, currentTimestamp); };

me tira un error que me dice

 commentCallback is not a function

Estoy intentando seguir el ejemplo de Vanilla JS , consulte la línea 68 aquí . Supongo que este problema está relacionado con este mensaje de advertencia que aparece en cada pulsación de tecla.

 quill:toolbar ignoring attaching to nonexistent format comments-add <button type="button" class="ql-comments-add"></button>

¿Cómo resuelvo el mensaje de advertencia y hago que funcione la devolución de llamada? O, en segundo lugar, ¿hay otra buena biblioteca de comentarios que funcione con Quill?

Puede encontrar un ejemplo de trabajo en Vanilla JS aquí: https://github.com/nhaouari/quill-comment/tree/master/example/quill-comment-test

Me gustaría replicar esto en React.