Con el siguiente código original, es una función que, basada en el valor de toCheck , está construyendo una clase css:
const computeSomething = (toCheck: string) => { return clsx('flex', { 'flex-start': toCheck === 'FIRST', 'flex-end': toCheck === 'LAST' }); } El requisito es usar enum para toCheck , probé algo pero probablemente esté mal:
export enum toCheck { FIRST = 'FIRST', LAST = 'LAST' } const computeSomething = (toCheck: string) => { return clsx('flex', { 'flex-start': toCheck.FIRST, 'flex-end': toCheck.LAST }); }El error dice:
La propiedad 'FIRST' no existe en el tipo 'string'.
¿Algunas ideas?
Está sombreando la enumeración usando el mismo nombre para su parámetro. Use un nombre diferente para la enumeración y el parámetro para evitarlo. El caso idiomático para las enumeraciones es PascalCase .
Después de eso, solo use un genérico que amplíe el tipo de enumeración y no debería tener problemas:
declare function clsx (...args: unknown[]): void; enum ToCheck { FIRST = 'FIRST', LAST = 'LAST', } const computeSomething = <T extends typeof ToCheck>(toCheck: T) => { return clsx('flex', { 'flex-start': toCheck.FIRST, 'flex-end': toCheck.LAST }); } computeSomething(ToCheck); // okEl problema es que su toCheck no se refiere a la enumeración (prevista) debido a que su parámetro tiene el mismo nombre ( toCheck: string ). Cambiar el nombre de cualquiera debería resolver el problema:
export enum ToCheckEnum { FIRST = 'FIRST', LAST = 'LAST' } const computeSomething = (toCheck: string) => { return clsx('flex', { 'flex-start': ToCheckEnum.FIRST, 'flex-end': ToCheckEnum.LAST }); }La convención es que enum/type debe tener el caso de Pascal, así que creo que es mejor de esta manera.
¿Por qué pasas toCheck como argumento? Solo haz esto:
export enum ToCheckEnum { FIRST = 'FIRST', LAST = 'LAST' } const computeSomething = (toCheck: ToCheckEnum) => { return clsx('flex', { 'flex-start': toCheck === ToCheckEnum.FIRST, 'flex-end': toCheck === ToCheckEnum.LAST }); }