Typescript使用动态和静态键创建对象的接口

时间:2018-01-24 11:23:55

标签: typescript interface typescript-typings

我正在尝试学习打字稿,而且在涉及界面时遇到了路障,我有一个对象要保存一个token和一个{{1}如下

route

我遇到的问题是:如何为此对象生成界面?

我试过了:

const obj = {
  token: 'thisismytoken',
  '/path/to/somewhere': [{ ... }]
}

但这会产生错误:

  

TS2411:属性'令牌'类型'字符串'不能分配给字符串索引类型' {...}'。

当我尝试类似的事情时会发生同样的事情:

interface iObject {
  token: string;
  [key: string]: { ... }[]
}

当我尝试类似的事情时:

interface iRoute {
  val1: number;
  val2: string;
}

interface iObject extends iRoute {
  token: string;
}

当我尝试将数据添加到路径变量时,我收到以下错误:

  

TS2339:Property' push'类型'字符串|中不存在{...} []'。
  物业'推动'类型'字符串'。

上不存在

有没有其他方法可以做到这一点?

2 个答案:

答案 0 :(得分:1)

你可以这样做。您正在尝试创建一个字典,这可能有所帮助。

拥有干净的代码

第一种方法

interface IDictionary<T> {
    [key: string]: T;
}

interface iObject {
    token: string;
    route: IDictionary<any[]>;
}

//Use it like this
var obj: iObject = {
            token: "thisismytoken",
            route: {
                "/path/to/somewhere": [{
                    pathName: 'somewhere'
                }]
            }
        };

这是working typescript playground

第二种方法基于您的上一次尝试

当我尝试类似的事情时:

  

interface iObject {[key:string]:{...} [] |串; }

    interface IDictionary<T> {
        [key: string]: T;
    }

    var obj: IDictionary<any> = {
            token: "asdf123",
            "path/to/somewhere": [{
                data: 'something'
            }]
        };
  

TS2339:Property&#39; push&#39;类型&#39;字符串|中不存在{...} []&#39;。   物业&#39;推动&#39;类型&#39;字符串&#39;。

上不存在

第三种方法

你可以像这样对你的obj进行类型转换

interface iObject {
  [key: string]: Array<object> | string;
}

self.obj = {
            token: self.tokenVal
        };
        self.obj[self.route] = [{ "routeName": self.routeName }];

        (<Array<object>>self.obj[self.route]).push({
            "zip": "123456"
        });

另请参阅Advanced Types

答案 1 :(得分:1)

您可以使用交叉点类型:

type iObject = {
    token: string
} & {
    [key: string]: { ... }[]
}

但请注意,索引类型并不限制您使用一个属性。您可能需要的是正则表达式验证密钥,might come in the future