TypeError: Cannot read property 'map' of undefined

1

import React, {useState,useEffect} from “react”;

import “…/styles.css”;

import { API } from “…/backend”;

import Base from “…/core/Base”;

import PostCard from “…/core/PostCard”;

import { getPosts } from “…/core/helper/coreapicalls”;

export default function UserDashBoard() {

const {posts, setPosts} = useState()

const {error, setError} = useState(false)

const loadAllPosts = () => {

getPosts().then(data => {

  if (data.error) {

    setError(data.error);

  }else {

    setPosts(data);

  }

})

}

useEffect(() =>{

loadAllPosts()

},)

return (

<Base title=" UserDash Board Page" description="Welcome to the Tshirt Store">

  <div className="row">

    {posts.map((post, index) =>{

      return (

        <div key={index}className="col-4 mb-4">

        <PostCard post = {post}/>

        </div>

      )

    })}

            

  </div>

</Base>

);

}

2

posts is not an array or undefined

3

Not sure if this is the problem since the code you pasted has very bad formatting, but useState returns an array which first element is the state value and the second is the setter. So instead of const {posts, setPosts} = useState([]) you want to have const [posts, setPosts] = useState([]). Same with the error.

(If you really wanted you could also do this with object destructuring but there is probably no reason to do this)