Map on array of objects (Error: Property 'map' does not exist on type '{}'. TS2339)

796 views Asked by At

I'm doing an App where I fetch a list of Job Offers with the Recruitee API. I stored the fetched Array in a state called jobs.

It looks something like this :

jobs = [ 0: {title: frontent-developer, company: whatever, departement: software}, 1: {title: fullstach-devloper, company: foobar, departement: management}]

Now I want to display it as a list with the help of the map function like this:

<ul>
{jobs.map((row) => {
                  return <li>(row.title)</li>;
                })}
</ul>

Now I get the error Error: Property 'map' does not exist on type '{}'. TS2339 and I'm not sure what is wrong or what to do.

Does somebody got an idea?

3

There are 3 answers

1
Bensu Rachel On

Try like this

const jobs = [
      {
        title: "frontent-developer",
        company: "whatever",
        departement: "software"
      },
      {
        title: "fullstach-devloper",
        company: "foobar",
        departement: "management"
      }
    ];

    return (
      <ul>
        {jobs.map((row) => {
          return <li>{row.title}</li>;
        })}
      </ul>
    );
0
aum trivedi On

I think this mistake in values try this.

let jobs = [{ 0: { title: " frontent - developer", company: "whatever",departement: "software" } }]

jobs.map((row, i) => {
return <li>(row[i].title)</li>;})
0
Peter Slanina On

As per @aum trivedi 's answer

This is incorrect json format :

  const  jobs = [ 0: {title: frontent-developer, company: whatever, departement: software}, 1: {title: fullstach-devloper, company: foobar, departement: management}]

Correct json format would be :

  const  jobs = [{ 0: {title: frontent-developer, company: whatever, departement: software}}, {1: {title: fullstach-devloper, company: foobar, departement: management}}]