在更改状态数组后，react.js不会更新DOM

Question

我正在尝试实现一个游戏，我将棋盘作为父类初始状态的二维数组。通过遍历该数组来呈现平铺。我将这些孩子作为道具传递给他们，以便他们可以改变那个状态数组。

现在，当我使用该函数更改数组时，HTML不会更新。当我调用setState时，数组会更新，但它永远不会重新渲染。我试过这个.forceUpdate（）但仍然没有运气。我接下来要做的是通过函数将该函数从该子函数传递给父函数以更新该子状态并且这可以工作，但我需要来自父级的函数递归调用自身来更新电路板。我觉得我可能会遇到反模式。我怎么能改变我的代码才能让DOM更新呢？

缺少部件，但这些都是涉及的部件。 statusBoard是具有该解决方案的电路板的内部版本。我希望这很清楚。

Answer 1

每当你将props和state连接在一起时，你必须创建一个componentWillReceiveProps函数，如下所示：

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

当游戏状态发生变化并将其作为道具传递给Field时，字段自身内部状态在此时不会更新，因为它依赖于自己的状态。这是一个反模式，你应该避免Field必须有任何状态，只需依靠它传递的道具，并有一个处理所有状态的父组件。

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