Getting “Cannot call a class as a function” in my React Project

Question

I\'m trying to add a React map component to my project but run into an error. I\'m using Fullstack React\'s blog post as a reference. I tracked down where the error gets thr

Answer 1

tl;dr

If you use React Router v4 check your component if you indeed use the component prop to pass your class based React component!

More generally: If your class seems ok, check if the code that calls it doesn't try to use it as a function.

Explanation

I got this error because I was using React Router v4 and I accidentally used the render prop instead of the component one in the component to pass my component that was a class. This was a problem, because render expects (calls) a function, while component is the one that will work on React components.

So in this code:

The line containing the component, should have been written like this:

It is a shame, that they don't check it and give a usable error for such and easy to catch mistake.