Type 'xxx' is missing the following properties from type 'xxx[]': length, pop, push, concat, and 28 more

I m using typescript and reactjs, this is the component that cause the problem

import type { InputProps } from "../utils/types"

const Input = (props: InputProps) => {
    const makeChildren = () => {
        return (
            <>
                <Description></Description>
                <Navigation></Navigation>
                <Entries entries={props.entries}></Entries>
            </>
        )
    }
    return (
        <Inquiry children={makeChildren()}></Inquiry>
    )
}

export default Input;

The error I got is in this line

  <Entries entries={props.entries}></Entries>
(property) EntriesProps.entries: PullDown[]
Type 'EntriesProps' is missing the following properties from type 'PullDown[]': length, pop, push, concat, and 28 more.ts(2740)
types.ts(17, 5): The expected type comes from property 'entries' which is declared here on type 'IntrinsicAttributes & EntriesProps'

Here is my Entries.tsx

const Entries = (props: EntriesProps) => {
    const handleSubmit = () => {
    }

    const entryComponents = props.entries.map((entry) => <BaseEntry entry={entry} key={entry.id}></BaseEntry>)

    return (
        <>
            {entryComponents}
            <button onClick={handleSubmit}>Submit</button>
        </>
    );
}

export default Entries;

and this is my types.ts file

interface PullDown {
    id: number;
    type: string;
    options: string[];
}

interface EntriesProps {
    entries: PullDown[];
}

interface InputProps {
    entries: EntriesProps,
}

I searched some similar questions, is this caused by Array-like Object? It doesn’t seem like so.

>Solution :

I think entries in InputProps should be PullDown

Leave a Reply