Getting undefined map error....Typerror while using the map-CodePudding

I'm getting this "TypeError: Cannot read properties of undefined (reading 'map')"

const Categories = () => {
    return (
    <Container>
       {categories.map((item) =>(
        <CategoryItem key={item.id}/>
       ))}
    </Container>
  )
}

CodePudding user response：

This means your categories variable is not defined, make sure it does have a value and its a valid array.

CodePudding user response：

categories is undefined so the map function is not available.

if you want to return no category items in this case you can do chained operator to test categories is not null first https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-7.html

const Categories = () => {
    return (
    <Container>
       {categories?.map((item) =>(
        <CategoryItem key={item.id}/>
       ))}
    </Container>
  )
}