title: TypeError: users.map is not a function in Mern
body: <p>I am trying to fetch data from backend, I want to load all data which are in database, when I load function then getting an error like &quot;User.map is not a function&quot;, please let me know where am wrong.</p>
  <blockquote>
  <p>User.js</p>
  </blockquote>
  <pre><code>import React, { useEffect, useState } from &quot;react&quot;;
  import { Link } from &quot;react-router-dom&quot;;
  import { getUsers } from &quot;./apis&quot;;
  
  const UserData = () =&gt; {
    const [users, setUser] = useState([]);
  
    useEffect(() =&gt; {
      AllUsers();
    }, []);
  
    const AllUsers = async () =&gt; {
      const response = await getUsers();
      console.log(response.data);
      setUser(response.data ? response.data : []);
    };
  
    return (
      &lt;div&gt;
        &lt;div className=&quot;container&quot;&gt;
          &lt;table className=&quot;table table-hover table-bordered mt-5&quot;&gt;
            &lt;thead&gt;
              &lt;tr&gt;
                {/* &lt;th scope=&quot;col&quot;&gt;No&lt;/th&gt; */}
                &lt;th scope=&quot;col&quot;&gt;Title&lt;/th&gt;
                &lt;th scope=&quot;col&quot;&gt;Details&lt;/th&gt;
                &lt;th scope=&quot;col&quot;&gt;Action&lt;/th&gt;
              &lt;/tr&gt;
            &lt;/thead&gt;
            &lt;tbody&gt;
              {users.map((user, index) =&gt; (
                &lt;tr key={index}&gt;
                  &lt;th scope=&quot;row&quot;&gt;{user.id}&lt;/th&gt;
                  &lt;td&gt;{user.title}&lt;/td&gt;
                  &lt;td&gt;{user.description}&lt;/td&gt;
                &lt;/tr&gt;
              ))}
            &lt;/tbody&gt;
          &lt;/table&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    );
  };
  </code></pre>
  <blockquote>
  <p>Api.js</p>
  </blockquote>
  <p>I have added api.js file please check it , and let me know where am wrong</p>
  <pre><code>export default UserData;
  
  import Axios from &quot;axios&quot;;
  
  const url = &quot;http://localhost:3000/&quot;;
  
  export const getUsers = async (id) =&gt; {
    id = id || &quot;&quot;;
    return await Axios.get(`${url}/${id}`);
  };
  
  export const deleteUser = async (id) =&gt; {
    return await Axios.delete(`${url}/${id}`);
  };
  </code></pre>