如何確保屬性的值是預定義的 object 中的值之一？

Question

我正在使用與 typescript 反應，並希望確保 state 類型限制為 object 中的值，就像這樣

考慮

 const [proessStatus, setProcessStatus] = useState<ProcessState>();

useState 必須僅接受來自 ProcessState Object 的值作為參數。

const ProcessState = {
    NOT_STARTED: 'NOT_STARTED',
    STARTED: 'STARTED',
    LOADING: 'LOADING',
    FINISHED: 'FINISHED'
}

有沒有辦法通過接口或任何其他方式在 typescript 中確保這一點。

Answer 1

是的，請使用基於字符串的枚舉！

enum ProcessState {
  NOT_STARTED = 'NOT_STARTED',
  STARTED = 'STARTED',
  LOADING = 'LOADING',
  FINISHED = 'FINISHED'  
}

它們的值是類型安全的（因此驗證發生在編譯時）。 您可以在運行時將枚舉 object 本身用作普通的 object。 如果您需要額外的運行時驗證，您可以使用Object.values(ProcessState)來獲取有效值。 您可以將它與Record<SomeEnum, SomeValueType>類型一起使用來創建類型安全映射等。

Answer 2

使用 enum 並將其用作 function 的參數的類型

enum ProcessState {
  NOT_STARTED = 'NOT_STARTED',
  STARTED = 'STARTED',
  LOADING = 'LOADING',
  FINISHED = 'FINISHED'  
}

function useState(p: ProcessState) {

   ...

}

useState(ProcessState.STARTED)