Неожиданная ошибка из Typescript, затем использование формы в PropTypes - PullRequest
Новая
       14

Неожиданная ошибка из Typescript, затем использование формы в PropTypes

0 голосов
/ 16 января 2020

Я объявил компонент и установил для него тип React.FC<Props> и propTypes, где: 

type Row = React.ReactElement[];

interface Header {
    value: string;
    title: string;
}

interface Props {
    headers: Header[];
    rows: Row[];
}

Table.propTypes = {
    headers: PropTypes.arrayOf(
        PropTypes.shape({
            value: PropTypes.string.isRequired,
            title: PropTypes.string.isRequired,
        }),
    ).isRequired,
    rows: PropTypes.arrayOf(PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.element, PropTypes.string]))).isRequired,
};

My IDE (PhpStorm) дал мне следующее сообщение об ошибке для header in propTypes: 

TS2322: Type 'Validator<InferProps<{ value: Validator<string>; title: Validator<string>; }>[]>' is not assignable to type 'Validator<Header[]>'.   Type 'InferProps<{ value: Validator<string>; title: Validator<string>; }>[]' is not assignable to type 'Header[]'.     Type 'InferProps<{ value: Validator<string>; title: Validator<string>; }>' is not assignable to type 'Header'.       Property 'value' is optional in type 'InferProps<{ value: Validator<string>; title: Validator<string>; }>' but required in type 'Header'.  Table.tsx(13, 2): The expected type comes from property 'headers' which is declared here on type 'WeakValidationMap<Props>'

и для rows

TS2322: Type 'Validator<(string | ReactElementLike)[][]>' is not assignable to type 'Validator<ReactElement<any, string | ((props: any) => ReactElement<any, string | ... | (new (props: any) => Component<any, any, any>)>) | (new (props: any) => Component<any, any, any>)>[][]>'.   Type '(string | ReactElementLike)[][]' is not assignable to type 'ReactElement<any, string | ((props: any) => ReactElement<any, string | ... | (new (props: any) => Component<any, any, any>)>) | (new (props: any) => Component<any, any, any>)>[][]'.     Type '(string | ReactElementLike)[]' is not assignable to type 'ReactElement<any, string | ((props: any) => ReactElement<any, string | ... | (new (props: any) => Component<any, any, any>)>) | (new (props: any) => Component<any, any, any>)>[]'.       Type 'string | ReactElementLike' is not assignable to type 'ReactElement<any, string | ((props: any) => ReactElement<any, string | ... | (new (props: any) => Component<any, any, any>)>) | (new (props: any) => Component<any, any, any>)>'.         Type 'string' is not assignable to type 'ReactElement<any, string | ((props: any) => ReactElement<any, string | ... | (new (props: any) => Component<any, any, any>)>) | (new (props: any) => Component<any, any, any>)>'.  Table.tsx(14, 2): The expected type comes from property 'rows' which is declared here on type 'WeakValidationMap<Props>'

Так в чем причина ошибки? Я вижу, что в Props все свойства обязательны и одинаковы для propTypes, но машинописный текст говорит о другом.

...