我正在创建图库页面，该页面将显示从API提取的图像。我正在通过ES6中的类进行操作。稍后，我需要等待所有图像加载（不仅是从API还是从我的HTML中）。之后，我在一些容器中添加/删除了特定的CSS类。 不幸的是，我的代码不想异步。
我正在使用ES6类，异步/等待并直接承诺。我已经尝试了很多解决方案，可以在stackoverflow上找到它们，但是对我来说没有任何作用。
g[v].push_back(make_pair(u , w));我想等待解析函数_renderPhotos中的所有onload事件，然后运行到下一个元素：document.getElementById（//here i want to wait for runFirstSearch and _renderButton to end completely.
async _renderElements(){
await this.runFirstSearch();
await this._renderButton();
document.getElementById(`"photoSet${this._step}"`).classList.remove("unvisible"); document.getElementById("showMore").classList.classList.remove("unvisible");
document.getElementById("loader").classList.add("unvisible");
}
// runFirstSearch is using function _renderPhotos:
_renderPhotos(data){
console.log("step6");
const photoSetDiv = document.createElement("div");
photoSetDiv.classList.add("unvisible");
photoSetDiv.id=`photoSet${this._step}`;
const urlArray=data.map( image => image.url);
const checkImage = path => {new Promise (resolve =>{
const img = new Image();
img.onload=() => {
console.log("photo is uploaded");
photoSetDiv.appendChild(img);
resolve(path)}
img.src=path;
})};
Promise.all(urlArray.map(checkImage)).then(result =>
this._container.appendChild(photoSetDiv) );
// here is my initial, synchronous code when I didn't think about asynchronous -> it can help in understanding my plan.
// data.forEach((image, index) =>{
// const classCSS = index === 4 ? "photo2":"photo1";
// let img= new Image();
// img.onload = function(){
// console.log("ahfikhfhwoi");
// photoSetDiv.appendChild(this);
// };
// img.src=image.url;
// img.classList.add(classCSS);
// });
// this._container.appendChild(photoSetDiv);
}
）。classList.remove（“ unvisible”）;