Getting "Cannot call a class as a function" in my React Project
For me it happened when I forgot to write extends React.Component
at the end.I know it's not exactly what YOU had, but others reading this answer can benefit from this, hopefully.
For me it was because I forgot to use the new
keyword when setting up Animated state.
eg:
fadeAnim: Animated.Value(0),
to
fadeAnim: new Animated.Value(0),
would fix it.
tl;dr
If you use React Router v4 check your <Route/>
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 <Route/>
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:
<HashRouter> <Switch> <Route path="/" render={MyComponent} /> </Switch></HashRouter>
The line containing the <Route/>
component, should have been written like this:
<Route path="/" component={MyComponent} />
It is a shame, that they don't check it and give a usable error for such and easy to catch mistake.