3

试图让类型在这里正常工作时遇到了一些麻烦。

我想在一个对象中指定每个顶级键是联合中的一个字符串，值是一个嵌套对象，它具有另一个联合中的一个字符串的键，它的值可以是来自第一个联合（有点像状态机）。

例如：

type Status = 'idle' | 'loading' | 'error' | 'view'
type Actions = 'search' | 'search_success' | 'search_failure'

const app = {
  idle: {
    search: 'loading'
  },
  loading: {
    search_success: 'view',
    search_fail: 'error',
  },
  error: {
    search: 'loading'
  }
  view: {
    search: 'loading'
  }
}

我尝试输入的内容是：

type States = { [key in Status]: { [key in Actions]: Status } };

虽然这不起作用。有人可以解释我如何利用一些实用程序类型来允许嵌套对象键不需要来自 Actions 类型的所有值吗？

谢谢！

4

2 回答 2

2

我稍微简化了你的代码。

这个定义

type Status = 'idle' | 'loading'
type State = { [key in Status]: any}

相当于

type State = { 
  idle: any;
  loading: any;
}

因此，以下代码无效

const foo: State = {
  idle: true
}

因为它缺少 prop loading。

一个解决方案- 使道具可选

type Status = 'idle' | 'loading' | 'error' | 'view'
type Actions = 'search' | 'search_success' | 'search_failure'

type States = { [key in Status]?: { [key in Actions]?: Status } };

const app: States = {
  idle: {
    search: 'loading'
  },
  loading: {
    search_success: 'view',
    search_failure: 'error',
  },
  error: {
    search: 'loading'
  },
  view: {
    search: 'loading'
  }
}

操场

于 2020-06-01T09:18:35.080 回答
1

@MoshFeu 的答案看起来可以正常工作，但正如我写的那样，我会发布它说你可以或多或少地用 a 得到相同的东西Partial：

type Status = 'idle' | 'loading' | 'error' | 'view'
type Actions = 'search' | 'search_success' | 'search_failure'

type States = { [key in Status]: Partial<{ [key in Actions]: Status }> };

const app: States = {
  idle: {
    search: 'loading'
  },
  loading: {
    search_success: 'view',
    search_failure: 'error',
  },
  error: {
    search: 'loading'
  },
  view: {
    search: 'loading'
  }
};
于 2020-06-01T09:24:19.443 回答