Question

我有一个表单，我使用组件来显示行，以便表单页面有n个组件页面。

      <form onSubmit={this.onSubmit} loading={loading} >
  <table className="ui celled table" border="1">
     <thead>
      <tr>
        <th >Status</th>
        <th >Date </th>
        <th >ID</th>
        <th >Plan</th>
      </tr>
    </thead>
    <tbody>
         {this.state.claims.map ( claim => <ClaimRow claim= { claim } updateClaims={this.updateClaims}  /> ) }
    </tbody>
    <tfoot className="full-width">
      <tr>
        <th colspan="4">
          <div className="ui small button">
            <Button Primary>Approve Selected</Button>
          </div>
          <div className="ui right floated button" >
              Next
                  <i class="right arrow icon"> </i>
          </div>
          <div className="ui right floated button" >
                  <i class="left arrow icon"></i>
             Prev
          </div>
        </th>
      </tr>
    </tfoot>
  </table>
  </form>

页面正确显示ClaimRow，每行都有一个OnChange事件处理程序。在onChange事件处理程序/行中，我想调用updateClaims来为父Component中的单个行设置State。这样，如果有人点击＆＃34;批准＆＃34;，则父组件的状态已准备好发送给DB的所有更改。

当我点击＆＃34; onChange＆＃34;时，我在onChange处理程序中收到错误，它无法引用updateClaims。

＆＃34; TypeError：_this.updateClaims不是函数＆＃34;

我的onChange处理程序

  onChange = e => {
    this.setState({status: e.target.value} );
    this.updateClaims(this.state._id,this.state);

}

Answer 1

应该是

this.props.updateClaims(this.state._id,this.state)

在剧本中，

<ClaimRow claim= { claim } updateClaims={this.updateClaims} />

updateClaims作为道具传递给ClaimRow组件，并在props内提供。

要访问它，在类组件中，您需要在this.props

上调用它

React - 无法访问传递函数

1 个答案: