javascript - Cómo obtener claves anidadas para un objeto de TypeScript y un arreglo de objetos
Para un generador de formularios, estoy tratando de obtener seguridad de tipos para un objeto anidado y un arreglo de objetos. Me gustaría que la propiedad name tuviera como valor la clave del objeto al que pertenece.
Entonces, en el ejemplo de abajo, name.name tiene que tener como valor "name".
Para el arreglo, los nombres de los objetos tienen que ser de los tipos anidados dentro de elecciones. Así que un objeto con name: "parentOption" y una opción con name: "code"
Para el objeto anidado, tiene que anidarse hasta la última propiedad y quiero que las propiedades del objeto y el nombre tengan tipo. Lo que quiero decir con esto es que,
Posición > Ubicación > x | y | z son los únicos nombres que se permiten suministrar.
Espero que esto tenga un poco de sentido. Con Keyof T, solo puedo tipar los primeros niveles del objeto del formulario, por lo que question, choices y position están tipados. Sin embargo, para los niveles más profundos, tengo que usar recursión y hasta ahora no he tenido éxito, ¡gracias!
type FormSchema = {
name: string
choices: { choice: string }[]
position: { location: { x: number, y: number, z: number } }
}
type TextField = {
name: string
label: string
}
const form = {
name: {
name: "name", // name must be name
label: "Question A"
},
choices: [
{
name: "choice", //name must be choice
label: "Choice"
}
],
position: { //this has to be position
location: { //this has to be location
x: {name: "x", label: "X"}, //name must be x
y: {name: "y", label: "Y"}, //name must be y
z: {name: "z", label: "Z"}, //name must be z
},
}
}Agregué una imagen para que sea un poco más claro lo que quiero. Todas las propiedades conectadas por las líneas al tipo deben ser tipeadas automáticamente. Sin embargo, debe ser dinámico para que cualquier tipo usado se tipeé automáticamente.
Respuesta #1
No estoy seguro de entender lo que estás tratando de hacer, pero el formulario parece ser del tipo
type FormSchema = {
question: { id: 'question'; label: string };
choices: { id: 'choice'; label: string }[];
position: { location: { x: number, y: number, z: number } } ;
}
Espero que ayude
