Estoy trabajando con datos que parecen
{ 8533864186048: "4", 8533864218816: "1", isExchange: true, returnType: "exchange", }donde las dos primeras claves son dinámicas pero siempre serán cadenas
así que traté de definir la interfaz como tal:
interface ReturnData { [key: string]: string; <- Applying this to whole interface for some reason isExchange?: boolean; returnType?: ReturnType; selectedVariant: Variant; } Así que tengo el problema de que tratar de definir un miembro dinámico en la interfaz hace que ts intente asignar todos los demás miembros para escribir string
¿Cuál sería la forma correcta de abordar esto?
Podrías hacer algo como:
interface ReturnData { isExchange?: boolean; returnType?: ReturnType; selectedVariant: Variant; [key: string]: string | boolean | ReturnType | Variant; }Pero en lugar de mezclar propiedades dinámicas y estáticas, creo que debería refactorizar su interfaz de esta manera:
interface ReturnData { isExchange?: boolean; returnType?: ReturnType; selectedVariant: Variant; someProps: { [key: string]: string; } }por lo que la interfaz es más legible.
Simplemente puede restringir todas las teclas number para que sean una cadena: [key:number]: string
type CustomReturnType = string; type Variant = string; interface ReturnData { [key: number]: string; // <--- any number key should be a string isExchange?: boolean; returnType?: CustomReturnType; selectedVariant: Variant; } const data: ReturnData = { isExchange: true, returnType: 'hello', selectedVariant: 'variant', 2334234234: 'sd', 234234234:23 // expected error }Puedes definir tu interfaz así
interface ReturnData { isExchange?: boolean; returnType?: ReturnType; selectedVariant: Variant; [key: string]: string | boolean | ReturnType | Variant; }Otro enfoque es este si solo desea que las teclas numeradas sean una cadena
type ReturnData = { [key in string | number]: key extends number ? string : string | boolean | ReturnType | Variant; } & { isExchange?: boolean; returnType?: RT; selectedVariant: V; }; const k: ReturnData = { 8533864186048: "4", 8533864186049: "3", 8533864186048: true // invalid };La implementación final se verá así
type ValidKeys = "isExchange" | "returnType" | "selectedVariant"; type ReturnData = { [key in string | number]: key extends ValidKeys ? string | boolean | ReturnType | Variant : string; } & { isExchange?: boolean; returnType?: ReturnType; selectedVariant: Variant; };