title: React change selected item index of array using order number
body: <p>Hi I am new developer at Reactjs. I have a question. It's maybe simple but I want to learn best practice or best way about changing selected item index of array according to user order number. I mean user will give a number from Input and I will use that number for placement inside the array.</p>
  <p>Example Object Array in My State :</p>
  <pre><code>const [state, setState] = useState({
      dragFrames:
         [{id:1,name:&quot;test-1&quot;,zIndex:1},
         {id:2,name:&quot;test-2&quot;,zIndex:2},
         {id:3,name:&quot;test-3&quot;,zIndex:3}]
      })
  </code></pre>
  <p>User zIndex Input <strong>&quot;1&quot;</strong> to item which id is <strong>3</strong></p>
  <p>My expected new Array order is below:</p>
  <pre><code>dragFrames:
         [id:3,name:&quot;test-3&quot;,zIndex:1},
         {id:1,name:&quot;test-1&quot;,zIndex:2},
         {id:2,name:&quot;test-2&quot;,zIndex:3}
         ]
  </code></pre>
  <p>I can change and set zIndex number of any object but I cant change array order according to input value. How can I do this? Could you help me ?</p>
  <p>I tried this before and I faced endless loop:</p>
  <pre><code> if (e.target.value&gt;0) {
                  nowDev.z = e.target.value
                  var arrayCopy = state.dragFrames.slice()
                  state.dragFrames.map((item:any,index:any)=&gt;{
                      if (index===e.target.value) {
                          arrayCopy.push(nowDev)
                      }else{
                          arrayCopy.push(item)
                      }
                  })
                  setState({ dragFrames: arrayCopy})
                  
              }
  </code></pre>