How to modify Array on React

Question

In api return value like this,

[
    "Action",
    "Comedy",
    "Documentary",
    "Drama"
]

I need to modify the above array like this,

 const techCompanies = [
      { label: "Action", value: 1 },
      { label: "Comedy", value: 2 },
      { label: "Documentary", value: 3 },
      { label: "Drama", value: 4 }
   ];

I used Axios to get data,

const response = await axios.get("http://localhost:3000/Movie/v1.0/genre");

how you are getting property value ?

Engineer
– Engineer

2019-05-05 14:16:45 +00:00
Commented May 5, 2019 at 14:16 — Engineer
– Engineer, Commented May 5, 2019 at 14:16
may be array index

BIS Tech
– BIS Tech

2019-05-05 14:34:04 +00:00
Commented May 5, 2019 at 14:34 — BIS Tech
– BIS Tech, Commented May 5, 2019 at 14:34

Gianmarco · Accepted Answer · 2019-05-25 16:52:11Z

4

This is an array so you can you use the .map() function to do that:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map

const arr = ["Action", "Comedy", "Documentary", "Drama"];

arr.map((arrElement, index) => ({ label: arrElement, value: index }));

edited May 25, 2019 at 16:52

answered May 5, 2019 at 14:20

Gianmarco

8402 gold badges16 silver badges40 bronze badges

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

9 Comments

BIS Tech Over a year ago

cannot use vale: index

Gianmarco Over a year ago

because the first element is 0 or for some other reason?

BIS Tech Over a year ago

no, when using value: error message coming ';' expected.

BIS Tech Over a year ago

I typed in your link also, this error is coming developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…

BIS Tech Over a year ago

var Data = [1, 4, 9, 16]; // pass a function to map const map1 = Data.map((arrElement, index) => { label: arrElement, value: index }); console.log(map1);

|

Collectives™ on Stack Overflow

How to modify Array on React

1 Answer 1

9 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

9 Comments

Your Answer

Sign up or log in

Post as a guest

Related