I have a react component that is trying to pass a function to another component, the problem is that I’m not being able to define the function, it throws a compiling error
export default function App() {
createActivity() { // here I get an error: missing semicolon
console.log("creating activity");
}
return (
<div className = "App" >
<Route path="/" component={ Header } />
<Route exact path="/" component={ShowSplashWindow} />
<Route path="/createactivitiy" render = {() =>
<CreateActivity createActivity={this.createActivity} />} />
</div>
);
}
What am I missing?
Rafael
Advertisement
Answer
You declared component as functional, but trying to create a class method.
You should either use class component:
export default class App extends React.Component {...
with 2 methods: createActivity and render.
Or declare your function and assign to constant
const createActivity = () => ...
but use it without this:
<CreateActivity createActivity={createActivity} />