RSVP from JS to React

Hi everyone!

I am trying to build the RSVP website from a JavaScript course to React after seeing the new React course. I have some problems inserting the <li> element inside the <ul> in a const called MainDiv.

    {this.state.invitees.map( invitees =>
      <Invited 
        name={invitees.invited}
        id={invitees.id}
        key={invitees.id.toString()}
      />
    )}

If I insert this into the MainDiv I get an error. If i do outside when I render class App I see it but outside the <ul>. I cant get it work inside the <ul> like doing this code:

const MainDiv = () => { return ( <div className="main"> <p>Invitees</p> <ul> {this.state.invitees.map( invitees => <Invited name={invitees.invited} id={invitees.id} key={invitees.id.toString()} /> )} </ul> </div> ) }

It says that cannot read the property of state.

Sorry about my english!