交換數組中的兩個對象：ReactJS

我問自己是否有乾淨，正確的方式使用setState來交換數組中的兩個對象。這是我目前所做的：交換數組中的兩個對象：ReactJS

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)); 
    } 
}

此代碼正在工作，但我認爲可能有更好的解決方案。對於這樣一個簡單的任務，似乎有太多的代碼行。謝謝！

來源

2017-08-31 Nocebo

爲什麼不簡單地通過使用第三個變量交換兩個數組值，如果你知道元素索引。首先將數組複製到另一個變量中，交換兩個數組值，然後使用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，你可以使用任何其他的方式來創建數組的一個副本。

來源

2017-08-31 07:23:30

它的工作原理，謝謝！我只是想看看是否有一個順利的選擇使用'setState'來完成。但是這看起來很乾淨！ – Nocebo

很高興它幫助你:)一個建議總是嘗試先執行計算，然後使用setState更新狀態值，而不是將邏輯放入setState中。 –

交換數組中的兩個對象：ReactJS

回答

相關問題