Es fácil cambiar la entrada del tipo de archivo a la URL de origen de la imagen para obtener una vista previa... pero... Teniendo en cuenta un escenario en el que intenta editar un blog, obtiene un blog y completa los campos de entrada en función de los datos recibidos. Todo funciona bien... pero ¿cómo manejas la entrada de imágenes? Recibimos la URL de la imagen como fuente de la imagen, pero ¿cómo podemos usar esa URL de la imagen para completar la entrada de imagen del tipo de archivo? 
Traté de buscar esto: https://stackoverflow.com/questions/50537735/convert-blob-to-image-file/50538148#:~:text=getContext(%222d%22)%3B%20%2F%2F ,archivo%20en%20el%20base64%20formato . pero no podía entender bien.
#Resuelto para mi caso de uso: hubo un error de mi parte, asumí que si el usuario no selecciona una imagen, el campo de la imagen quedará vacío y, por lo tanto, pondrá un valor nulo en la base de datos. Me di cuenta de eso, no es como lo que he pensado.
Se puede hacer con la ayuda de la biblioteca fetch como esta: -
const imageSrcURLToFile = async (image_url) =>{ const image = await fetch(image_url); const blob = await image.blob(); const url = URL.createObjectURL(blob); const link = document.createElement('a') link.href = url; link.download = 'image file name here' document.body.appendChild(link) link.click() document.body.removeChild(link) }para obtener más información, consulte este artículo: - https://dev.to/sbodi10/download-images-using-javascript-51a9