Вам нужно сделать два разных интерфейса под каждый вариант. При этом поле type будет иметь не тип string, а конкретно "bigCard" в одном случае и "smallCard" в другом. Пример:
interface BigCard {
type: 'bigCard';
bigCardProp: string;
}
interface SmallCard {
type: 'smallCard';
smallCardProp: number;
}При этом на стороне потребителя входной параметр типизируется как BigCard | SmallCard:
function MyComponent(prop: { card: BigCard | SmallCard })Это также добавит дополнительную проверку того, что в type указано конкретно либо "bigCard" либо "smallCard", а не какая-то произвольная строка.
1 эксперт согласен
Для описания входящих props в React компоненте, которые могут иметь разные типы в зависимости от значения props.type, используйте TypeScript и перечисление типов (union types). Вот пример кода:
interface BigCardProps {
type:... Читать далее
1 эксперт согласен
В TypeScript для описания входящих props с разными типами можно использовать условные типы. Например, для React компонента, который ожидает пропсы type с типом "bigCard" или "smallCard", можно использовать следующий код:
type... Читать далее
Заработать пару сотен рублей онлайн на Яндекс✺Толока! Регистрируйся.
Перейти на toloka.yandex.ru/promo