javascript - react.js-ReactCSSTransitionGroup引发异常

我正在尝试添加动画以输入到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>
     );
  }
});

最佳答案

由于原始答案是基于上述代码正确的假设，因此，根据您的小提琴修改了此处的代码。

在您的小提琴中，您没有适当地引用ReactCSSTransitionGroup。您将其称为React.ReactCSSTransitionGroup，当然是undefined。这就是为什么您尝试将任何东西包装起来时，小提琴会抱怨的原因，因为您使用的是未定义的值。为了使您的小提琴正常工作，您必须像这样引用css过渡组：

var ReactCSSTransitionGroup = React.addons.CSSTransitionGroup;

更正后的小提琴：http://jsfiddle.net/r98d348f/4/