Skip to content

defining a function to pass it as props, but I get a compiling error

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

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} />