使用动画时ReactJS错误

Question

我有一个有效的ReactJS应用程序，我正在尝试使用动画（https://facebook.github.io/react/docs/animation.html）

我正在尝试将过渡动画应用于添加表格行。现有的工作渲染如下所示：

return React.DOM.tbody({ valign: 'top' }, rows);

我尝试过切换到这个：

return React.DOM.tbody({ valign: 'top' }, React.createElement(ReactCSSTransitionGroup, {transitionName: "example"}, rows));

但我现在在控制台中收到警告和错误：

  

React尝试在容器中使用重用标记但校验和   无效。这通常意味着您正在使用服务器呈现   并且在服务器上生成的标记不是客户端的标记   期待。反应注入新的标记，以补偿哪些有效，但你   失去了服务器渲染的许多好处。相反，图   为什么生成的标记在客户端上是不同的   服务器

     

错误：不变违规：ReactMount：根元素ID不同   reactRootID。

有什么想法吗？

Answer 1

我错过了一些明显的东西。文档说：

  

默认情况下，ReactTransitionGroup呈现为 span

所以它在表中创建了无效的标记。我已将component = property设置为“tr”，现在可以正常工作。