打字稿 - 創建複雜的對象

Question

以下變量包含對象的列表的接口：

scenes = { 
    sky: { 
     image: 'assets/1.jpg', 
     points: { 
     blue_area: { 
      x: 1, 
      y: 2 
     }, 
     } 
    }, 
    blue_area: { 
     image: 'assets/2.jpg', 
     points: { 
     sky: { 
      x: 1, 
      y: 2 
     } 
     } 
    } 
}; 

如何我可以聲明爲這種變量的接口？

Answer 1

你可以聲明爲場景的類型：

type Points = { 
    [key: string]: { 
    x: number; 
    y: number; 
    } 
} 

type Scenes = { 
    [key: string]: { 
    image: string; 
    points: Points; 
    } 
} 

let scenes: Scenes = { 
    sky: { 
     image: 'assets/1.jpg', 
     points: { 
     blue_area: { 
      x: 1, 
      y: 2 
     }, 
     } 
    }, 
    blue_area: { 
     image: 'assets/2.jpg', 
     points: { 
     sky: { 
      x: 1, 
      y: 2 
     } 
     } 
    } 
};