具有组件的材料表作为数据未在onChange事件中传递组件上下文

我试图将组件作为材料表中的数据添加,但是我无法访问组件的“ this”上下文来更新onChange函数中的状态。物料表提供的可编辑功能不符合我的要求。

class ClubList extends Component {
  state = { clubs: '',tableclubs: [] };

  changeDate=(change)=>{      
    console.log(this) //returns undefined.  I need to update state here but not able to access 'this' context of component
  }


  addClub = (event,clubs) => {
    let enteredClubs = this.state.clubs;
    let allClubs = this.props.clubs;
    let tableclubs = [];
    let enteredClubsArray = enteredClubs.split(/[,]+/);
    for (let clubs in enteredClubsArray) {
      tableclubs.push(allClubs.find(({ number }) => number == enteredClubsArray[clubs]));
    }
    tableclubs.map(
      (clubs) => (
        (clubs.scheduledDate = (        
          <DateComponent name="eventDate"
value={this.props.createData.eventDate} 
handleChange={this.changeDate} /> //Im calling the function here
        )),(clubs.city = clubs.city)
      )
    );
    this.setState({ clubs: '',tableclubs });
    this.clubsForCreate(tableclubs);
  };

  render() {
    return (
      <div classname="clubSection">
            <TextComponent
              label="Enter Clubs"
              name="clubs"
              variant="outlined"
              handleChange={this.changeState}
              value={this.state.clubs}
            />
            <Fab color="primary" aria-label="add" onClick={this.addClub} classname="clubAddButton">

        <MaterialTable
          title="Clubs"
          columns={[
            { title: 'Date',field: 'scheduledDate' },{ title: 'Status',field: 'statusDesc' },]}
          data={this.state.tableclubs}
        />
      </div>
    );
  }
}
singapore1 回答:具有组件的材料表作为数据未在onChange事件中传递组件上下文

将功能“ changeDate”从箭头功能更改为普通功能可解决此问题。我猜箭头功能正在删除回调函数的上下文

本文链接:https://www.f2er.com/3161796.html

大家都在问