我是TypeScript的新手,并尝试了多种输入方式,但是遇到了索引签名问题。接口应该是什么样?
interface MyConfig {
...
}
// someVar can be any string
let someVar = "dynamicKey";
// the structure of the object cannot change
const config: MyConfig = {
myObj: {
[someVar]: {
firstProp: 'some text',
secondProp: 'some text',
},
thirdProp: 'some text',
},
};
如果您知道someVar
变量的确切值,则可以使用严格的接口,例如:
interface MyConfig {
myObj: {
SomeKey: {
firstProp: string
secondProp: string
},
thirdProp: string
}
}
然后,您可以使用:
const someVar = "SomeKey";
const config: MyConfig = {
myObj: {
[someVar]: {
firstProp: 'some text',
secondProp: 'some text',
},
thirdProp: 'some text',
},
};
但是,如果您希望这种变化someVar
是动态的,那就有些棘手了。为此,我建议您将动态零件移至单独的块,以便可以使用:
interface MyConfig {
myObj: {
dynamic: {
[key: string]: {
firstProp: string
secondProp: string
}
},
thirdProp: string
}
}
const someVar = "SomeKey";
const config: MyConfig = {
myObj: {
dynamic: {
[someVar]: {
firstProp: 'some text',
secondProp: 'some text',
},
},
thirdProp: 'some text',
},
};
最后,如果您具有动态功能someVar
并且无法更改数据结构。您可以使用以下命令:
interface MyConfig {
myObj: ({
[key: string]: {
firstProp: string
secondProp: string
} | string
} & {
thirdProp: string
})
}
const someVar: string = "SomeKey";
const config: MyConfig = {
myObj: {
[someVar]: {
firstProp: 'some text',
secondProp: 'some text',
},
thirdProp: 'some text',
},
};
// String
console.log(config.myObj.thirdProp.trim())
// Error, union string | object
console.log(config.myObj.abc.firstProp)
if (typeof config.myObj.abc === 'object') {
// string
console.log(config.myObj.thirdProp.trim())
// string
console.log(config.myObj.abc.firstProp.trim())
}
在此示例中,我们使用打字稿索引签名+指定已知属性。您还可以注意到一个奇怪的事情-索引签名具有并集object | string
。这是由于打字稿限制:
一旦有了字符串索引签名,所有显式成员也必须符合该索引签名。这是为了提供安全性,以便任何字符串访问都可以得到相同的结果。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句