type MenuName = 'menu1' | 'menu2'; const [menuState, setMenuState] = useState({ menu1: true, menu2: false, }); <SubMenu handleToggle={() => handleToggle('menu1')} name="Item1" />; <SubMenu handleToggle={() => handleToggle('menu2')} name="Item2" />;Ahora MenuName está codificado con menu1 y menu2, pero quiero agregar valores dinámicos de tipo de una matriz como
const menus = [ { name: 'menu1', collapse: true, }, { name: 'menu2', collapse: false, }, ];en este caso :
type MenuName = menus.map(item=>item.name).join('|');es un error No se puede encontrar el espacio de nombres 'menús'.
Creo que esto es lo que quieres:
const menus = [ { name: 'menu1', collapse: true, }, { name: 'menu2', collapse: false, }, ] as const; type MenuName = typeof menus[number]['name']; // type MenuName = "menu1" | "menu2" Observe la afirmación const , vea que as const , es una forma de decirle a TypeScript que esta matriz no va a cambiar. Si no lo hace, establecerá MenuName como string porque puede ser una matriz cada vez mayor con cualquier valor de cadena que posiblemente sea el nombre del menú.
Enlace del patio de recreo: https://tsplay.dev/Wk5DlN