Tengo un componente de reacción. Ese componente recibe la lista, tipo. La lista es una matriz de objetos. El tipo es solo una cadena de enumeración opcional. Dentro de este componente tengo una función que es simplemente una caja de cambios. Quiero hacer cumplir un tipo específico en cada instrucción CASE.
Ejemplo sencillo a continuación. MENSAJE DE ERROR: La propiedad 'pk' no existe en el tipo 'combinedInterfaces'. La propiedad 'pk' no existe en el tipo 'basicInterface'.
Matriz1:
[ {some: {id: 1}, name: 'John'}, {some: {id: 2}, name: 'Jan'}, ]Matriz2:
[ {pk: 1, some: { id: 12}, name: 'John'}, {pk: 2, some: { id: 13}, name: 'Jan'}, ]Renderizando mis componentes:
<MyComponent list={array1} /> <MyComponent list={array2} type={typesList.myType} />Contenido de MyComponent
export enum typesList { myType = 'myType' } interface basicInterface { some: { id: number; }, name: string; } interface myTypeInterface extends basicInterface{ pk: number; } type listType = Array<combinedInterfaces> type combinedInterfaces = myTypeInterface | basicInterface; type MyComponentProps = { list: listType, type: typesList } const MyComponent = ({list, type}: MyComponentProps) => { const handleType = (item: combinedInterfaces) => { switch (type) { case typesList.myType: { return { id: item.pk (ERROR HERE) } } default: { return { id: item.some.id } } } } const handledList = useMemo(() => list.map(item => handleType(item),[list]) return ( <> {handledList.map(item => <div> {item.id} </div> )} </> ) }Deberías hacer un typecast para item , así:
const MyComponent = ({list, type}: MyComponentProps) => { const handleType = (item: combinedInterfaces) => { switch (type) { case typesList.myType: { return { id: (item as myTypeInterface).pk } } default: { return { id: (item as basicInterface).some.id } } } }