react.js - ReactCSSTransitionGroup 抛出异常

react.js - ReactCSSTransitionGroup throws exception

我正在尝试在 React.js 应用程序 (http://facebook.github.io/react/docs/animation.html) 中添加用于进入我的列表的动画。

但是ReactCSSTransitionGroup抛出这样的异常:

Uncaught TypeError: Cannot read property '_mockedReactClassConstructor' of undefined

连同警告:

Warning: React.createElement: type should not be null or undefined. It should be a string (for DOM elements) or a ReactClass (for composite components). warning.js:36

Warning: Only functions or strings can be mounted as React components.

我的组件看起来像:

var List = React.createClass({
  render: function () {
    var items = this.props.data
        .filter(function (item) {
            return item.stream;
        })
        .map(function (item) {
            return <div key={item.id}>item.name</div>;
        });

      return (
        <div className="list clearfix">
            <ReactCSSTransitionGroup transitionName="example">
                {items}
            </ReactCSSTransitionGroup>
        </div>
     );
  }
});

由于原始答案是基于上述代码正确的假设,因此这里根据您的 fiddle.

进行了修改

在您的 fiddle 中,您没有 属性 引用 ReactCSSTransitionGroup。您将其引用为 React.ReactCSSTransitionGroup,这当然是 undefined。这就是为什么你的 fiddle 会抱怨,如果你试图在其中包装任何东西,因为你使用的是未定义的值。要使 fiddle 正常工作,您必须像这样引用 css 过渡组:

var ReactCSSTransitionGroup = React.addons.CSSTransitionGroup;

更正后的fiddle:http://jsfiddle.net/r98d348f/4/