Problema: - Entonces, cuando inserto una imagen en el editor quill js, carga la imagen como formato de base de datos64. Que es muy grande para moverse por diferentes páginas.
Objetivo: - Quiero hacer un programa para que cuando se inserte una imagen en el editor, descargue la imagen, a través del backend de laravel y devuelva la URL de la imagen para reemplazar el img src en el dom. Ya hice la descarga de imagen y url devolviendo parte del código.
Pregunta principal : - Si edito Delta de quill js, ¿también cambiará el img src en el dom?
PD: - Todavía no tengo un código para enviar. Solo tengo curiosidad por saber si los cambios delta se reflejarán en DOM o no. Por favor comente si necesita más información, gracias
Entonces descubrí que setContents(delta) en el editor y eso cambió la base de datos 64 a url.
emailEditor.on('editor-change', function(eventName,args) { var delta = ( emailEditor.getContents() ); if (eventName === 'text-change') { let arr = (args['ops']); if (args['ops'].length == 1 && !(arr[0].hasOwnProperty('delete'))){ if (args['ops'][0]['insert']['image'] != null){ for (let index = 0; index < delta['ops'].length; index++) { if (delta['ops'][index]['insert'].hasOwnProperty('image') && args['ops'][0]['insert']['image'] == delta['ops'][index]['insert']['image']) { saveImage(index); } } } } else if (args['ops'].length == 2 && !(arr[1].hasOwnProperty('delete'))){ if (args['ops'][1]['insert']['image'] != null){ for (let index = 0; index < delta['ops'].length; index++) { if (delta['ops'][index]['insert'].hasOwnProperty('image') && args['ops'][1]['insert']['image'] == delta['ops'][index]['insert']['image']) { saveImage(index); } } } } } function saveImage(key) { let imageURL = JSON.stringify(delta['ops'][key]['insert']['image']); $.ajax({ headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') }, type: "POST", url: "url-to-backend", data: { "imageURL": imageURL }, success: function (data) { delta['ops'][key]['insert']['image'] = (data); emailEditor.setContents(delta); }, error: function (data) { alert("some Error"); } }); } });Mi código no es perfecto, pero funciona para mí, si encuentra que esto no es adecuado para la comunidad o si desea que agregue comentarios sobre el trabajo, hágamelo saber, eliminaré / editaré la Pregunta / Respuesta.