'Fill massive state with data obtained from hooks

I have a massive data that I can obtain only using third party hooks, for example: const data1 = useSmthHook(1) where 1 - index;

Lets imagine that we need an object of 100 values:

const data1 = useSmthHook(1)
const data2 = useSmthHook(2)
const data3 = useSmthHook(3)
...
const data100 = useSmthHook(100)

It would be great to get as final result object with all 100 values.

Solution with loop doesn't work because of hooks can't be triggered inside loops.

//does not work!
for (var i = 1; i < 101; i++) {
      const data = useSmthHook(i)
      ....
    }

I have only one idea (im sure a bad one) that works: create empty array, rendering 100 components, in Item component logic: while render get hook value => update global state with this data. So every new Item render causes +1 row (update) global state. 100 updates and 100 re-reneders.



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source