Las propiedades del objeto en la matriz son interdependientes, por ejemplo, cuando se llama a AComponent
Quiero que los componentesProps sean Type1Props, cuando items.type === 'type1' , if items.type === 'type2' componentesProps deberían ser Type2Props
//I want componentProps must be Type1Props, when ` items.type === 'type1' `, if `items.type === 'type2'` componentProps shoud be Type2Props <AComponent items= {[ {type:'type1', componentProps{ }} {type:'type2', componentProps{ } ]}>A continuación se muestra el código AComponent.tsx
// if type === type1 the value must be constraint with Type1Props type ComTypes = { type1 : Type1Props, type2 : Type1Props, type2 : Type1Props, } type ItemType = 'type1' | 'type2' | 'type3' // The object properties in the array type ItemProps<T> = { type: T componentProps: ComTypes[T] showItem?: boolean } interface Props extends FormProps { itemsArray: QDItemProps[] } const AComponent: FC<Props> = ({itemsArray}) => { } export default AComponentNo sé cómo solove esta escena
Puede usar tipos de unión para hacer esto. Te daré un ejemplo más genérico que no usa reaccionar, para el beneficio de otros que pueden tropezar con esta pregunta.
type Type1Props = "A"; type Type2Props = "B"; type Type3Props = "C"; type PropTypes = | { type: "type1", componentProps: Type1Props, } | { type: "type2", componentProps: Type2Props, } | { type: "type3", componentProps: Type3Props, }; const p1: PropTypes = { type: "type1", componentProps: "A", }; const p2: PropTypes = { type: "type2", componentProps: "B", };Debería poder extender esto para su caso de uso.