Javascript React-更改数据会更改renderToStaticMarkup（）的输出，但不会重新绘制

我正在构建一个React应用程序，看起来有点像这样：

我使用的是通量模式，所以我有一个包含数据的存储。顶层面板请求数据，创建适当的子组件，并向下传递数据的子集。这是递归发生的，所以我可以无限嵌套这些组

正如你所看到的，到目前为止它仍然有效！我可以点击按钮添加一个新的国家，我得到一个新行。我可以点击按钮添加一个新的城市到英国，我得到一个新行。然而，当我点击按钮向美国添加一个新城市时，什么都没有发生

我可以看到数据的变化

初始状态：

{
  "planet": {
    "name": "Earth",
    "countries": [
      {
        "name": "United Kingdom",
        "cities": [
          {
            "name": "London"
          },
          {
            "name": "Birmingham"
          }
        ]
      },
      {
        "name": "United States of America"
      }
    ]
  }
}

单击按钮将城市添加到美国后：

{
  "planet": {
    "name": "Earth",
    "countries": [
      {
        "name": "United Kingdom",
        "cities": [
          {
            "name": "London"
          },
          {
            "name": "Birmingham"
          }
        ]
      },
      {
        "name": "United States of America",
        "cities": [
          {

          }
        ]
      }
    ]
  }
}

我甚至可以通过调用子元素上的

React.renderToStaticMarkup（）

，检查React生成的实际标记是否发生了更改

以下是之前美国行的标记：

名称
城市

及之后：

名称
城市
名称

---

然而，它没有被重新绘制。我在这里遗漏了什么吗？

尝试使用React.renderToString（）而不是React.renderToStaticMarkup（），因为静态标记呈现不提供任何用于React呈现客户端交互的钩子。

componentWillReceiveProps:function（newProps）{this.setState（{promdata:newProps.promdata}），链中是否有任何组件实现componentShouldUpdate？您是否在某些组件中使用purendermixin？PureRenderMixin只做了一个肤浅的比较，因此如果您只在状态对象的更深层次上更改状态a，它将不会更新。我的任何组件都没有实现

component shouldUpdate

，我也没有使用PureRenderMixin。我只使用

renderToStaticMarkup（）

来比较生成的标记，实际上，我并没有使用它来渲染浏览器。一切都是以通常的方式呈现的。