javascript - Biến được sử dụng trước khi được gán giá trị (TypeScript)

Tôi đang cố gắng lấy ImgString bên trong một mảng mà tôi nhận được từ API và gán chuỗi đó vào thuộc tính base64 của đối tượng photo nhưng nó hiển thị lỗi này. Tôi mới học React và TypeScript/JavaScript nên tôi không chắc lỗi xảy ra ở đâu.

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; 
}

Câu trả lời #1

Biến photo của bạn đã được khai báo nhưng chưa được gán khi bạn viết (Do đó xảy ra lỗi - "được sử dụng" trước khi "được gán"):

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

Bạn nên viết cái này:

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

hoặc

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

Bạn có thể đọc sự khác biệt giữa khai báo và định nghĩa.