1

I want to declare some state variable like : processId_1, processId_2, processId_3 ..... processId_n .

const [processId, setProcessId] = useState(0); I just want to use loop on the code to declare these variable. Something like that:

for (let index = 0; index < 30; index++) {
    const [processId["".concat("_",index)], setProcessId]["".concat("_",index)] = useState(0);
    
}

enter image description here

I also want to send them as props. How to do that.

  • 1
    Don't try and create multiple state values, instead, have one state value `processes`, that is an _array_ of values. – Nick Parsons Jul 27 '22 at 05:24
  • 1
    why not store the id as an array? or a set? `const [processIds, setProcessIds] = setState(new Set())` – davidhu Jul 27 '22 at 05:24
  • Take a look at this post on ["Variable" variables](https://stackoverflow.com/questions/5187530/variable-variables-in-javascript) – Nick Parsons Jul 27 '22 at 05:32

1 Answers1

1

It is possible to create an array of these states. So code would look like this:

const [processIds, setProcessIds] = useState([
    {
      id: '1',
      name: 'processId 1'
    },
    {
      id: '2',
      name: 'processId 2'
    }
]);

const handleClick = () => {
  setProcessIds([...processIds].map(pr => {
        if(pr.id === '1') {
          return {
            ...pr,
            name: 'processId is edited'
          }
        }
        else return pr;
      }))
}

<button onClick={handleClick}>
</button>

UPDATE:

It is possible to add keys into object dynamically like this:

const  obj = {};

for (let i = 10; i <= 20; i++) {
    obj['processId_' + i] = 0;
} 

An example:

const  obj = {};

for (let i = 10; i <= 20; i++) {
    obj['processId_' + i] = 0;
}    

console.log(obj)
StepUp
  • 36,391
  • 15
  • 88
  • 148
  • Thank you very much. After your comment I write my code as below: const initialProcessIds = { processId_11: 0, processId_12: 0, processId_13: 0, processId_14: 0, processId_15: 0, processId_16: 0, processId_17: 0, processId_18: 0, processId_19: 0,} const [processIds, setProcessIds] = useState(initialProcessIds); But can you help me achieve this: const initialProcessIds = { for (let index = 0; index < 10; index++) { processId_1["".concat("",index)]: 0, }} – Md. Tazimul Islam Raj Jul 27 '22 at 06:34
  • @Md.TazimulIslamRaj please, see my updated answer – StepUp Jul 27 '22 at 09:10