Как отобразить массив нескольких типов в TypeScript?

Question

Если у меня есть переменная, тип которой является массивом, который может принимать несколько типов…

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

И я выполняю ручную проверку типов с условной логикой для переменных данных…

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

Как видите, я сопоставляю массив и возвращаю один компонент, если это RedType, и я возвращаю что-то еще для BlueType.

Однако, машинопись не нравится, она не знает, что я выполняю условия вручную. Итак, это ошибки:

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

И наоборот.

У меня всегда будет массив нескольких типов, который я не могу изменить.

Answer 1

Возможно, вы хотите, чтобы ваша функция isRed() была определяемым пользователем типом защиты . То есть измените свою подпись на что-то вроде

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

и ваш код должен начать компилироваться без ошибок. Надеюсь, это поможет; удачи!