JSFiddle - React, Tailwind, and code Playground
HTML
<span id="dvd"></span>
JavaScript
// exemplo de uma array com caminhos de 4 imagens separadas por vírgula
caminhos = "https://homepages.cae.wisc.edu/~ece533/images/airplane.png,https://homepages.cae.wisc.edu/~ece533/images/arctichare.png,https://homepages.cae.wisc.edu/~ece533/images/baboon.png,https://homepages.cae.wisc.edu/~ece533/images/frymire.png";
var VARimg_categoria = caminhos.split(",");
var y = 0;
var image = new Image();
function carregaImagem(y){
image.src = VARimg_categoria[y];
image.onload = function(){
// para exemplificar, esta linha joga as imagens dentro de uma div
document.getElementById("dvd").innerHTML = document.getElementById("dvd").innerHTML+y+'.<img height="50" src="'+image.src+'" />';
// faz o que quiser aqui após o carregamento da imagem
y++; // incrementa o y para ver se ainda há imagens
if(y < VARimg_categoria.length){
carregaImagem(y); // próxima imagem a ser carregada
}else{ // else opcional quando todas as imagens tiverem sido carregadas
alert("Todas a imagens foram carregadas");
}
}
}
carregaImagem(y);