如果用任意字符串表示状态,'sucess' 这样的拼写错误可能一直留到运行时。联合类型可以把可用值限制在一个明确集合中。

声明有限的状态值

TypeScript
type RequestState = 'idle' | 'loading' | 'success' | 'error'

function getMessage(state: RequestState) {
  if (state === 'loading') return '正在加载'
  if (state === 'error') return '加载失败'
  if (state === 'success') return '加载完成'
  return '等待开始'
}

编辑器会提示允许的值。判断完所有状态后,类型检查也能帮助发现遗漏分支。

需要携带数据时

可以把状态和对应数据组合成判别联合类型,例如成功状态带数据、错误状态带错误信息。这样每种状态能携带恰当的信息,而不是把所有字段都写成可选。