javascript - Hur man mappar över en array med flera typer i TypeScript?

Om jag har en variabel vars typ är en array som kan ta flera typer…

type myData = (RedType | BlueType)[];
//`const data` is of type myData

Och jag utför en manuell kontroll av typerna med en villkorssats för att göra viss logik på variabeldata…

     {data.map((element, index) => {
        if (isRed(element)) {
          return <Red data={element} key={index} />;
        } else {
          return <Blue data={element} key={index} />;
        }
      })}

Som du kan se, mappar jag arrayen och jag returnerar en komponent om det är en RedType och jag returnerar något annat för BlueType.

Dock gillar inte TypeScript detta, det vet inte att jag manuellt gör en villkorlig. Så det ger ett fel:

type ‘RedType | BlueType’ is not assignable to type ‘RedType’.

Och vice versa.

Jag kommer alltid att ha en array av flera typer, som jag inte kan ändra.

Svar #1

Du vill förmodligen att din isRed()-funktion ska vara en användardefinierad typvakt. Det vill säga, ändra dess signatur till något i stil med

declare function isRed(x: any): x is RedType;

och din kod bör börja kompilera utan fel. Hoppas det hjälper; lycka till!

Relaterade artiklar