search

yuanyan / boron

A collection of dialog animations with React.js
https://yuanyan.github.io/boron
MIT License
1.48k stars 153 forks source link

Invariant Violation #11

Closed seekshiva closed 9 years ago

seekshiva commented 9 years ago

My code looks similar to the one given in the example in the ReadMe. Any idea why I get this error?

Error message:

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.

seekshiva commented 9 years ago

Turns out the issue was caused because all my components were using the global React loaded by an external file directly onto DOM, but boron was using the react from NPM dependency.

Multiple versions of react won't play well together.

I've fixed the issue by doing this on top of my root component:

const React = require('react')
window.React = React

This way, I can continue to not explicitly do "require('react')" in the rest of components in my component hierarchy. And, both my components, and boron get to use the same version of react.