ShakaCode | ShakaCode Blog | Rails On Maui Blog | Rails | ReactJs | JavaScript | Webpack | Productivity |

Problem with redux and railsContext being null


#1

I’m trying to add redux to my react on rails project that previously did not use it.
Working through the errors I’ve gotten stuck on one related to railsContext being null.

I’m following the set up of the code in the react-webpack-rails-tutorial and for some reason the railsContext isn’t null in that project but has the value of an empty hash. But I can’t figure out where it is being set. I’ve painstakingly checked dozens of times and my code identically mirrors this project in its structure yet my railsContext is null.

Only relevant info I found was this.

When you use a “generator function” to create react components (or renderedHtml on the server) or you used shared redux stores, you get 2 params passed to your function:

Props that you pass in the view helper of either react_component or redux_store
Rails contextual information, such as the current pathname. You can customize this in your config file.
This information (props and railsContext) should be the same regardless of either client or server side rendering.

While you could manually pass the railsContext information in as “props”, the rails_context is a convenience because it’s passed consistently to all invocations of generator functions.

So if you register your generator function MyAppComponent, it will get called like:

reactComponent = MyAppComponent(props, railsContext);

A few questions:

  1. What is a generator function and how do you create react components with it? I couldn’t find any info about this.

  2. Why is it passed automatically in the react-webpack-rails-tututorial project but not in mine. Is there some setting to enable this?

3)The readme says:

The railsContext has: (see implementation in file react_on_rails_helper.rb, method rails_context for the definitive list)."

I looked in react_on_rails_helper.rb but I don’t understand what i’m looking for. Do I just copy this file into my project? What am I looking for in here and why does the react-webpack-rails-tutorial not need to do any of this?

I’m using 6.9.1


#2

So rather than registering a React component, register a function that takes several parameters and returns a react component.

If you want personalized help on this, please consider our Coaching Plan.