Aquí hay una caja de arena que muestra el problema.https://codesandbox.io/s/trusting-moon-n058k?file=/src/index.ts
Entrada :
data.types = { starter: true, main: false, side: false, dessert: true, drink: false }Salida deseada :
recipe.types = ["starter", "dessert"]Solución :
type NewRecipeFormValues = { types: { starter: boolean, main: boolean, side: boolean, dessert: boolean, drink: boolean } } const postNewRecipe = (data: NewRecipeFormValues) => { let recipe = JSON.parse(JSON.stringify(data)); recipe.types = Object.keys(data.types).filter( (key: keyof NewRecipeFormValues["types"]) => data.types[key] ); };Problema : el mecanografiado nunca se cierra sin importar el tipo que use.
Cualquier ayuda sería apreciada porque estoy perdiendo la cabeza.
El error ocurre porque el compilador no puede inferir el tipo de tiempo de ejecución de la key porque Object.keys puede devolver una lista arbitraria de cadenas que no son necesariamente keyof NewRecipeFormValues["types"] .
Por lo tanto, debe decirle explícitamente al compilador que la key es de hecho la keyof NewRecipeFormValues["types"] para que pueda calmarse.
Para ello, utilice el tipo de aserción .
type NewRecipeFormValues = { types: { starter: boolean; main: boolean; side: boolean; dessert: boolean; drink: boolean; }; }; const postNewRecipe = (data: NewRecipeFormValues) => { let recipe = JSON.parse(JSON.stringify(data)); recipe.types = Object.keys(data.types).filter( (key) => data.types[key as keyof NewRecipeFormValues["types"]] ); };Mira este parque infantil .
En cuanto a por qué no puede usar key: keyof NewRecipeFormValues["types"] , la documentación vinculada lo explica mejor.