react.js在更改狀態數組之後不更新DOM

我試圖在反應中實現一個遊戲，其中父代作爲父類的初始狀態中的二維數組。通過遍歷該數組來呈現Tiles。我將這些孩子作爲道具傳遞給他們，以便他們可以更改狀態數組。react.js在更改狀態數組之後不更新DOM

現在，當我使用該函數更改數組時，HTML不會更新。當我調用setState時，數組會更新，但它永遠不會變形。我試過this.forceUpdate（），但仍然沒有運氣。然後我做的是通過該函數將函數從該子項傳遞給父項，以更新該子項的狀態，並且這可行，但我需要父項的函數來遞歸調用以更新該白板。我覺得我可能會遇到反模式。如何更改我的代碼以便更新DOM？

有零件丟失，但這些都是涉及的所有組件。 statusBoard是具有該解決方案的電路板的內部版本。我希望這很清楚。

來源

2016-10-17 Sebastian

每當你要鏈接的道具和國家一起，你必須創建一個componentWillReceiveProps功能，像這樣：

componentWillReceiveProps: function(nextProps) { 
    this.setState({ 
     positionX: nextProps.columnPosition, 
     positionY: nextProps.rowPosition 
    }); 
    }

當遊戲狀態的變化，並傳遞下來作爲道具場，場自身的內部狀態沒有得到因爲這是依靠自己的國家而更新的。這是一種反模式，你應該避免Field必須擁有任何狀態，只需依靠它通過的道具並擁有處理所有事情狀態的父組件。

https://facebook.github.io/react/tips/props-in-getInitialState-as-anti-pattern.html

來源

2016-10-17 20:09:12 finalfreq

謝謝你的回答！我已經編輯過，但這仍然無效。我已閱讀componentWillReceiveProps並瞭解其目的。 – Sebastian

這完全有道理，但我不明白我只能如何處理這個領域？我必須將場地保存在某個中心以迭代它，對吧？你能否按照正確的方向推動我如何改變我的組件結構，以便擁有上述類似的東西？ – Sebastian

有沒有反正你可以得到一個完整的工作代碼筆或jsbin爲此？它會更容易看到完整的代碼/實際示例 – finalfreq

react.js在更改狀態數組之後不更新DOM

回答

相關問題