4

This is my component, with ref

import React, { Component } from 'react';
export default class Comp1 extends Component {

render() {
  return (
    <span >
      <span ref="someRef">
        <input type='text'/>
      </span>
    </span>
  );
}

which responds as expected on development env, but when I build with production env, then the following error comes

invariant.js:38 Uncaught Invariant Violation: addComponentAsRefTo(...): Only a ReactOwner can have refs. You might be adding a ref to a component that was not created inside a component's render method, or you have multiple copies of React loaded (details: https://facebook.github.io/react/warnings/refs-must-have-owner.html).

I am really stuck with this error. Has anyone faced similar issue?? With react v15.0.1

According to official documentation for this error, there can be two reasons, Invalid Refs and Multiple copies of react. Here is my npm ls react

└── react@15.2.1

And, the following is npm ls | grep react

enter image description here

Mahesh Haldar
  • 581
  • 1
  • 6
  • 16
  • Possible duplicate of [What does 'Only a ReactOwner can have refs.' mean?](http://stackoverflow.com/questions/28519287/what-does-only-a-reactowner-can-have-refs-mean) – Patrick Roberts Jul 27 '16 at 20:28
  • Thanks for giving the link for similar issue. Please read the updated section – Mahesh Haldar Jul 27 '16 at 20:50
  • I had the same issue with the error only showing in production builds. It turned out that after a refactor I was using the same string ref over and over again while mapping over an array. Removing the ref also fixed the error. – Malte Dec 21 '16 at 10:42

0 Answers0