使用动画时 ReactJS 错误
ReactJS error when using animations
我有一个可用的 ReactJS 应用程序,我正在尝试使用动画 (https://facebook.github.io/react/docs/animation.html)
我正在尝试将过渡动画应用到添加的 table 行。现有的工作渲染看起来像这样:
return React.DOM.tbody({ valign: 'top' }, rows);
我试过切换到这个:
return React.DOM.tbody({ valign: 'top' }, React.createElement(ReactCSSTransitionGroup, {transitionName: "example"}, rows));
但我现在在控制台中收到警告和错误:
React attempted to use reuse markup in a container but the checksum
was invalid. This generally means that you are using server rendering
and the markup generated on the server was not what the client was
expecting. React injected new markup to compensate which works but you
have lost many of the benefits of server rendering. Instead, figure
out why the markup being generated is different on the client or
server.
Error: Invariant Violation: ReactMount: Root element ID differed from
reactRootID.
有什么想法吗?
我错过了一些明显的东西。文档说:
By default ReactTransitionGroup renders as a span
所以它在 table 中创建了无效标记。我已将 component= 属性 设置为 "tr" 现在可以使用了。
我有一个可用的 ReactJS 应用程序,我正在尝试使用动画 (https://facebook.github.io/react/docs/animation.html)
我正在尝试将过渡动画应用到添加的 table 行。现有的工作渲染看起来像这样:
return React.DOM.tbody({ valign: 'top' }, rows);
我试过切换到这个:
return React.DOM.tbody({ valign: 'top' }, React.createElement(ReactCSSTransitionGroup, {transitionName: "example"}, rows));
但我现在在控制台中收到警告和错误:
React attempted to use reuse markup in a container but the checksum was invalid. This generally means that you are using server rendering and the markup generated on the server was not what the client was expecting. React injected new markup to compensate which works but you have lost many of the benefits of server rendering. Instead, figure out why the markup being generated is different on the client or server.
Error: Invariant Violation: ReactMount: Root element ID differed from reactRootID.
有什么想法吗?
我错过了一些明显的东西。文档说:
By default ReactTransitionGroup renders as a span
所以它在 table 中创建了无效标记。我已将 component= 属性 设置为 "tr" 现在可以使用了。