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

In file MyComponent.js

export default class MyComponent extends React.Component {
...
}

I put some function related to that component:

export default class MyComponent extends React.Component {
...
}

export myFunction() {
...
}

and then in another file imported that function:

import myFunction from './MyComponent'
...
myFunction() // => bang! "Cannot call a class as a function"
...

Can you spot the problem?

I forgot the curly braces, and imported MyComponent under name myFunction!

So, the fix was:

import {myFunction} from './MyComponent'