React Error (Only a ReactOwner can have refs.)

Question

I\'ve just installed a fresh react into my rails project with \'React-rails\' and added searchkit on top of it. But I\'m getting some errors with it.

Unc

Answer 1

It seems I'm about late for the party but, just in case, someone may experience this issue again and need a more direct solution.

For your reference:

• Rails 5.2.0
• Ruby 2.5.1p57 (2018-03-29 revision 63029) [x86_64-darwin17]
• React-rails (2.3.1)

I believe this could happen on different rails and ruby versions too.

As like what @kasperite said, I'm sure you are having two React instances by mistake. You are either 'require react' twice or running into the dual instances by the 'require_tree .' in the 'application.js' file.

To be more specific, you should check the following lines in the 'application.js' file:

//= require react
//= require react_ujs
//= require components
//= require_tree .

The issue is that you first load React by require react directive, then load it again using the require_tree . directive.

Ref: https://guides.rubyonrails.org/asset_pipeline.html#manifest-files-and-directives

Or direct quote from the official guide as in the above link

The require_tree directive tells Sprockets to recursively include all JavaScript files in the specified directory into the output. These paths must be specified relative to the manifest file. You can also use the require_directory directive which includes all JavaScript files only in the directory specified, without recursion.

To sort the issue, you just need to completely delete the require_tree . directive or unset it by removing the equal sign - turn this //= require_tree . to // require_tree .

Hope this help and cheers.