Переменная используется до назначения (TypeScript)

Question

Я пытаюсь получить ImgString внутри массива, который я получаю от API, и назначить эту строку свойству base64 объекта фотографии, но он отображает ошибку. Я новичок в реакции и tyescript / javascript, поэтому я не уверен, где это go неправильно.

import { useState, useEffect } from "react";



export function getImages () {
const [photos, setPhotos] = useState<Photo[]>([]);


const GetPhotoURL = "***"


useEffect(() => {
  const loadSaved = async () => {
      const data = await axios.get(GetPhotoURL)
        .then(res =>  {

          const photos = [] as Photo[];

          for (let i  = 0; i <= res.data.length; i++) {
            var photo: Photo;

            photo.base64 = `data:image/jpeg;base64,${res.data[i].ImgString}`;

            photos.push(photo);
         }

          setPhotos(photos);
        })

  };
  loadSaved();
}, []);
    return {      
        photos,
    };
}
export interface Photo {
    base64?: string; 
}

Answer 1

Ваша переменная photo объявляется, но не назначается при записи (Отсюда ошибка - «используется» перед «назначено»):

var photo: Photo; // line 1
photo.base64 = `data:image/jpeg;base64,${res.data[i].ImgString}`; // line 2
// at line 2, you are trying to access the base64 property of photo which is not yet assigned

Вы должны либо написать следующее:

var photo: Photo = {}; // declaration + assignment
photo.base64 = `data:image/jpeg;base64,${res.data[i].ImgString}`;
photos.push(photo);

или

var photo: Photo = {
  base64: `data:image/jpeg;base64,${res.data[i].ImgString}`,
} // declaration + assignment
photos.push(photo)

Вы можете прочитать разницу между объявлением и определением .