Creating an array type in typescript [closed]

Question

Closed. This question needs debugging details. It is not currently accepting answers.

Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.

Closed 5 years ago.

Improve this question

I created an array type in typescript which looks like this

export type RamenApi = [
    {
        "Brand": string,
        "Variety": string,
        "Style": string,
        "Country": string,
        "Stars": number,
        "Top Ten": string
    }
]

Now, In one of the places, where I am sorting and filtering the array, I am getting the following error

Property '0' is missing in type '{ "Brand": string; "Variety": string; "Style": string; "Country": string; "Stars": number; "Top Ten": string; }[]' but required in type 'RamenApi'

Any idea on why I am getting the following error and how I can fix it?

  type Props = {
        searchData: RamenApi, 

    const [filteredSearch, setFilteredSearch] = useState<RamenApi | null>(null)


 const {searchData} = props
            const tempFilteredSearch = []
                for (let i=0; i<searchData.length; i++) {
                    const currentResponse = searchData[i]
                    const searchVariable = currentResponse["Variety"].toLowerCase() + currentResponse["Brand"].toLowerCase() + currentResponse["Country"]
                    if (searchVariable.indexOf(text) > - 1) {
                        tempFilteredSearch.push(currentResponse)
                    }
                }
                setFilteredSearch(tempFilteredSearch.slice(0,5))

This is where I am getting error setFilteredSearch(tempFilteredSearch.slice(0,5)). Also, the code is cut short. ignore missing brackets or any such mistakes

There is no possible way anyone can answer this question without seeing the code which that error message refers to. Please write a minimal reproducible example. — kaya3
– kaya3, Commented Mar 8, 2020 at 17:05
The type you defined means "An array that contains one element and this element is an object with fields: "Brand" of type string, "Variety" ...". But than you are trying to set an array with multiple items to the state of your type — Shlang
– Shlang, Commented Mar 8, 2020 at 17:10
@Shlang Okay, So how I can create my type to have multiple items? — Alwaysblue
– Alwaysblue, Commented Mar 8, 2020 at 17:12
I'm not sure I understand what you want to achieve. If you just want to have an array of strings it is string[], if you want to ensure only limited set of string values can be put to the array it is ("Brand" | "Variety" ...)[]. — Shlang
– Shlang, Commented Mar 8, 2020 at 17:15

skdonthi · Accepted Answer · 2020-03-08 17:16:38Z

1

The shape of a type or a type interface will be and most likely the same as the object in that array.

Create something like this

export type RamenApi = {
        Brand: string,
        Variety: string,
        Style: string,
        Country: string,
        Stars: number,
        TopTen: string
    }

Then

searchData: RamenApi[], 

const [filteredSearch, setFilteredSearch] = useState<RamenApi[] | null>(null)

answered Mar 8, 2020 at 17:16

skdonthi

1,4721 gold badge22 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Dennis Tretyakov · Accepted Answer · 2020-03-08 17:14:59Z

0

I assume there s a typo. What is declared there - is a type that ALWAYS have a SINGLE item for specified structure.

I may assume the intent was to declare array that MAY have from 0 to N items of defined structure, then the syntax should be like this:

export type RamenApi = {
    "Brand": string,
    "Variety": string,
    "Style": string,
    "Country": string,
    "Stars": number,
    "Top Ten": string
}[]

answered Mar 8, 2020 at 17:14

Dennis Tretyakov

315 bronze badges

Collectives™ on Stack Overflow

Creating an array type in typescript [closed]

2 Answers 2

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Linked

Related