在ts中，如果一个interface的key是枚举应该怎么写

Question

enum Link{
  a = 'a',
  b = 'b',
  c = 'c'
}
interface Common{
  name:string;
  age: number
}
interface A extends Common{
  id: string;
}
interface B extends Common{
  value: string | number;
}
interface C extends Common{
  id: string | number;
}
type U = A | B | C

interface Props{
  Link: U;
  type:string;
}
const p:Props = {
  [Link.a]: {
    name: 'li',
    age: 24,
    id: '123'
  },
  [Link.b]:{
    name:'li',
    age: 23,
    value:'123'
  },
  [Link.c]:{
    name: 'li',
    age: 24,
    id: '34'
  },
  type: 'c'
}

这样写是编译不过的。但是改成这样就可以了

interface Props{
  [Link.a]: A;
  [Link.b]: B;
  [Link.c]: C;
  type: string
}

但是我不想在Props中把枚举的所有值重新写一遍。正确的应该怎么写？

Answer 1

用 mapped type，用完之后不能加额外的属性，用类型并运算解决。

type Props = {
    [key in Link]: U;
} & { type: string;}

完整的：

enum Link{
  a = 'a',
  b = 'b',
  c = 'c'
}
interface Common{
  name:string;
  age: number
}
interface A extends Common{
  id: string;
}
interface B extends Common{
  value: string | number;
}
interface C extends Common{
  id: string | number;
}
type U = A | B | C;

type Props = {
    [key in Link]: U;
} & { type: string;}

const p:Props = {
  [Link.a]: {
    name: 'li',
    age: 24,
    id: '123'
  },
  [Link.b]:{
    name:'li',
    age: 23,
    value:'123'
  },
  [Link.c]:{
    name: 'li',
    age: 24,
    id: '34'
  },
  type: 'c'
}

Answer 2

可以改成这样

interface Props{
  type: string;
}

type PropsType = {
  [k in Link]: U
} & Props

const p:PropsType = {
  [Link.a]: {
    name: 'li',
    age: 24,
    id: '123'
  },
  [Link.b]:{
    name:'li',
    age: 23,
    value:'123'
  },
  [Link.c]:{
    name: 'li',
    age: 24,
    id: '34'
  },
  type: 'c'
}

Answer 3

感谢以上回答。找到了相同的问题

Using enum as interface key in typescript