在自定义成分发生化学反应CSS过渡小组

Question

我发现了一个Invariant Violation: addComponentAsRefTo(...)错误，而试图添加ReactCSSTransitionGroup到我的收藏组件。

我的父母渲染功能看起来像：

var notes = this.props.notes.reverse().map(function (v) { 
     return <NoteItem note={v} key={v.id} />; 
    }); 

    return (
     <div className="note-container"> 
     <ReactCSSTransitionGroup transitionName="example" > 
      {notes} 
     </ReactCSSTransitionGroup> 
     </div> 
    ); 

而且Note组件的渲染函数返回：

return (
     <div> 
     <div className={classNames} onClick={this._onClick}> 
      {note.text} 
     </div> 
     { showDetails ? <NoteItemDetails note={note} /> : null } 
     </div> 
    ); 

NoteItemDetails组件可能是unrelevant那里。

完整的错误信息是：

Uncaught Error: Invariant Violation: addComponentAsRefTo(...): Only a ReactOwner can have refs. This usually means that you're trying to add a ref to a component that doesn't have an owner (that is, was not created inside of another component's 'render' method). Try rendering this component inside of a new top-level component which will hold the ref.

的任何解决方案，这可能会帮助我解决这个问题？

Answer 1

问题是，我使用require('react/tools')而模块使用require('React')并反应物通过browserify加载两次。

字母大小写的问题！