Coverting打字稿字符串文字類型爲字符串

Question

的陣列我有

type ImageVerticalSpacing = 'ignoreBottom' | 'ignoreTop' | 'ignoreBoth' 
| 'Default'; 

在打字稿和需要通過這些字符串作爲一個字符串數組，以一個下拉。 如何將ImageVerticalSpacing類型轉換爲字符串數組？

Answer 1

您不能將TypeScript中的類型轉換爲運行時的值。但是你可以做相反的事情：創建一個運行時對象並讓TypeScript推斷它的類型。

用於此目的的理想運行時對象應該是tuple。不幸的是，TypeScript本身並不能推導出元組。我使用了一個名爲tuple()的幫助函數，它返回元組類型。

使用上面的輔助函數，你可以這樣做：

const imageVerticalSpacing = tuple('ignoreBottom','ignoreTop','ignoreBoth','Default'); 

type ImageVerticalSpacing = (typeof imageVerticalSpacing)[number]; 

的imageVerticalSpacing對象是你可以用你的下拉列表中，['ignoreBottom','ignoreTop','ignoreBoth','Default']類型的字符串數組。 ImageVerticalSpacing與您聲明的'ignoreBottom' | 'ignoreTop' | 'ignoreBoth' | 'Default'相同。

（看到它在行動上The Playground）

希望有所幫助。祝你好運！

Answer 2

TypeScript接口或類型別名在運行時不存在。所以你不能在運行時使用它們的值。您可以嘗試使用枚舉：

enum ImageVerticalSpacing { 
    ignoreBottom, 
    ignoreTop, 
    ignoreBoth, 
    Default 
} 

Object.keys(ImageVerticalSpacing).filter(k => isNaN(k as any)) // The filter is to filter out the index keys that TypeScript generates. See the generated JS code 
// ["ignoreBottom", "ignoreTop", "ignoreBoth", "Default"] 

Playground link