score:0

typically the issue when something like this ends up as undefined is that the "this" isn't bound to a specific object. for classes that have methods that use "this", especially using react, i would recommend binding them in the constructor. for example:

class editjobscheduler extends component {
  constructor(props) {
        super(props);
        this.state = { modalactive: false, todaydate: moment() };
        this.handlechange = this.handlechange.bind(this);
  }

  handlechange = (date) => {
    this.setstate({
        todaydate: date
    });
  }

something like this binds the method to each instance rather than to the class itself. i hope this helps.

score:1

i think you're trying to join handler and renderer into one method.

it doesn't make sense - handler changes state which will force new render - event if it would work in first pass - next would overwrite it but also call setstate and so on...

just use it separately:

jobclickedhandler = (event, index) => {
    this.setstate( { editmodalactive: true });
}

rendereditmodal = () => {
          return (
                <editjobscheduler
                      open={this.state.editmodalactive}
                      onclose={this.closeeditmodal}
                      schedulejobhandler={this.schedulejobhandler}
                      inputhandler={this.inputhandler}
                      jobinfo={this.state.jobdata[index]}
                />
          )
}


{this.state.editmodalactive && this.rendereditmodal() }

i would also decompose content/functional parts to separate components to avoid rerendering of all elements on each state change.


Related Query

More Query from same tag