How to pass the TS type checking for component props

Issue

export const Component: React.FC<SpaProps> = function({
    a,
    b,
    c,
    d
})

a, b, c belong to SpaProps. However, d doesn't. How I can add a prop type, which supports a,b,c,d together? BTW I know what the type for d

export interface IT {
    d: AxiosInstance;
}

Solution

You can extend the type with Typescript like this:

export const Component: React.FC<SpaProps & IT> = function({
    a,
    b,
    c,
    d
})

Even if you didn't know the type, you could write it like this:

export const Component: React.FC<SpaProps & {d: AxiosInterface}> = function({
    a,
    b,
    c,
    d
})

Answered By - Martin Seeler