Initialize state iterating an array of objects

Question

This questin will be more clear if i show the code:

initializing state with an empty array is easy:

export default function MyComponent() {
  const [state, setState] = useState([]);
}

however, i have an array of paths and i need to create an object for each path like this:

{
  source: path,
  options: { type: 'local' }
}

how am i supposed to initialize state with an array of objects which is created using a loop?
i tried this approach but didnt work:

export default function MyComponent({ paths }) {
  const [state, setState] = useState([ paths.map((path) => ({source: path, options: {type: 'local'} }) ]);
}

Don't put [ and ] outside of paths.map, try this.

Deniz
– Deniz

2021-11-21 18:27:20 +00:00
Commented Nov 21, 2021 at 18:27 — Deniz
– Deniz, Commented Nov 21, 2021 at 18:27

neuroine · Accepted Answer · 2021-11-21 19:00:25Z

1

You can try to use spread operator:

export default function MyComponent({ paths }) {
    const [state, setState] = useState([...paths.map((path) => ({source: path, options: { type: 'local' }, }))]);
}

answered Nov 21, 2021 at 19:00

neuroine

3313 silver badges23 bronze badges

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

Collectives™ on Stack Overflow

Initialize state iterating an array of objects

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related