未定义反应道具 [英] React Props is Not Defined

问题描述

我无法理解为什么我的pros.updateBuilding不工作。

当道具位于Render方法中时，以下操作有效

class Buildings extends Component {
  constructor(props) {
      super(props);
  }

  componentWillMount() {
    this.props.fetchBuildings();
  }

  renderBuildings(building) {
    return (
      <div>
          <p> {building.name}</p>
      </div>
    );
  }


  render() {
    return (
      <div> 
        {this.props.buildings.map(this.renderBuildings)}
        <button type="button" className="btn btn-success" onClick={this.props.updateBuilding.bind(this, 1)}>Edit</button>
      </div>
    );
  }
}

function mapStateToProps(state) {
  return { buildings: state.buildings.all };
}
function mapDispatchToProps(dispatch){
  return bindActionCreators({ fetchBuildings, updateBuilding}, dispatch);
}

但是，当我将this.props.updateBuilding放到如下所示的renderBuildings方法中时.

  renderBuildings(building) {
    return (
      <div>
          <p> {building.name}</p>
          <button type="button" className="btn btn-success" onClick={this.props.updateBuilding.bind(this, building.id)}>Edit</button>
      </div>
    );
  }

我收到错误：

Cannot read property 'props' of undefined

当属性updateBuildings在renderBuildings方法中时似乎无法读取，我不确定是什么原因导致了这一问题。

推荐答案

您误读了此错误。props不是未定义的，调用props的是未定义的，这是this关键字。您可以通过传入第二个参数来手动设置map函数的上下文

this.props.buildings.map(this.renderBuildings, this)

或内联绑定

this.props.buildings.map(this.renderBuildings.bind(this))

这篇关于未定义反应道具的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！