Отображение Усиливает хранилище.get()

#reactjs #amazon-s3

Вопрос:

К черту всех. Я пытаюсь получить один URL-адрес из корзины S3. Эта работа идеальна

 const [imageURL, setImageURL] = useState("");  const {  title,  content,  imagePath, //This imagePath is the S3 key  } = article.article;   useEffect(() =gt; {  const getImage = async () =gt; {  try {  const imageAccessURL = await Storage.get(imagePath);   setImageURL(imageAccessURL);//That's how I can get the URL   } catch (error) {  console.error("error accessing the Image from s3", error);  setImageURL("");  }  };  getImage();  }, [imagePath]);   

Прямо сейчас я пытаюсь получить URL-адрес списка из корзины S3 при сопоставлении.

 export default function ArticleComponent() {   const handleImage = async (imagePath) =gt; {   try {  const imageAccessURL = await Storage.get(imagePath);   return imageAccessURL; //I don't know how to apply states or any other methods   } catch (error) {   console.error("error accessing the Image from s3", error);  }  };  const renderList = articles.map((article) =gt; {  const {  id,  content,  title,  imagePath,  } = article;   return (  lt;Paper className={classes.paper} key={id} elevation={5}gt;   lt;img src={handleImage(imagePath)} alt="" /gt; //I want get URL here    lt;/Papergt;  );  });  return (  lt;Boxgt;   {renderList}   lt;/Boxgt; )  

но в конце концов, в lt;img src={handleImage(imagePath)} alt="" /gt; Это вернет обещание объекта. статьи включают список статей, а путь к изображению является ключом корзины S3. необходимо использовать это хранилище ожидания.get(ключ), чтобы получить реальный URL-адрес доступа, один может использовать useState, но для сопоставления я понятия не имею, как это сделать.

Надеюсь, кто-нибудь сможет помочь! Спасибо

Ответ №1:

Наконец я нашел решение. Используйте обещание.все

 const {  imageKeys //This imagePath is the S3 key  } = article.article;   const [imgKeyFromServer, setImgKeyFromServer] = useState([]);   useEffect(() =gt; {  const getImage = async () =gt; {  try {  setImgKeyFromServer([]);  const imageAccessURL = await Promise.all(  Array.from(imageKeys).map((key) =gt;  Storage.get(key, {  level: "public"  })  )  );  setImgKeyFromServer((url) =gt; url.concat(imageAccessURL));  } catch (error) {  console.error("error accessing the Image from s3", error);  setImgKeyFromServer([]);  }  };  console.log("imageKeys", imageKeys);  if (imageKeys) {  getImage();  }  }, [imageKeys]);  

Это может получить все URL-адреса из хранилища S3.