配列内の2つのオブジェクトを交換する：ReactJS

Question

setStateを使用して配列内の2つのオブジェクトを交換する、きれいで適切な方法があるかどうか自分に尋ねました。これは私が現在行っていることです：

export function moveStepUp(index) { 
    if(index > 0){ 
     let currentStep = this.state.stepsData[index]; 
     let stepAbove = this.state.stepsData[index - 1]; 

     this.setState((prevState) => ({ 
      stepsData: prevState.stepsData.map((step, i) => { 
       if(i === index - 1) 
        return { 
         ...currentStep, 
         position: i 
        }; 
       if(i === index) 
        return { 
         ...stepAbove, 
         position: i 
        }; 

       return step; 
      }) 
     }),() => console.log(this.state.stepsData)); 
    } 
} 

このコードは動作していますが、より良い解決策があると思いました。このような単純な作業のために、あまりにも多くのコード行のように思えます。ありがとう！

Answer 1

エレメントインデックスがわかっている場合は、3つ目の変数を使用して2つの配列値を交換するだけではいかがですか。 最初に配列を別の変数にコピーし、2つの配列値を交換してからsetStateを使用して状態値を更新します。このよう

：

this.setState(prevState => { 
    let data = [...prevState.data]; 

    let temp = data[index-1]; 
    data[index-1] = data[index]; 
    data[index] = temp; 

    return { data }; 
}) 

代わりのspread operatorは、あなたは、配列のコピーを作成するための他の方法を使用することができます。