Как сделать зависимые пропсы в компоненте? [React] [TypeScript]

Question

Есть компонент, он принимает поля type и users. Как сделать так, чтобы в зависимости от type, поле users было обязательным. Например если type required, то тогда users обязательно нужно передавать в компонент. А если type !== required то тогда users не нужно передавать в компонент.

interface iCard {
   type: 'required' | 'not-required;
   users: iUsers[];
}

const Card: React.FC<iCard> = ({ type, users }) => {
   ...
}

Answer 1

interface ICardRequired {
  type: 'required';
  users: iUsers[];
}

interface ICardNotRequired {
  type: 'not-requiered';
  users?: iUsers[];
}

type Props = ICardRequired | ICardNotRequired


const Card: React.FC<Props> = ({type, users}) => {
   ...
}

UPD
Подобный вопрос уже был задана на англоязычной версии stackoverflow

Ознакомиться с ответами вы можете здесь:
https://stackoverflow.com/questions/58630750/react-typescript-component-with-two-different-prop-interfaces

БЛОГ НА HUSL

Как сделать зависимые пропсы в компоненте? [React] [TypeScript]

Ответы (1 шт):