Question

我不确定在映射数组时尝试使用函数时为什么会出现"TypeError: Cannot read property 'handleClickSimilar' of undefined"错误。

     handleClickSimilar = (d) => {
        console.log("testing click") 
    }


 render() {
      (...rest of my component)  
      <div className="bottom-content-right">
        <h3>Participating countries:</h3>
        {otherCountries && otherCountries.map(function(d, idx){
          return (<div onClick={() => this.handleClickSimilar(d)} key={idx}>{d}</div>)
        })}
      </div>

Answer 1

您需要使otherCountries.map函数成为箭头函数（即（d，idx）=> ）。

将otherCountries.map(function(d, idx){替换为otherCountries.map((d, idx) =>{

所以会像

{otherCountries && otherCountries.map((d, idx) => {
  return (<div onClick={() => this.handleClickSimilar(d)} key={idx}>{d}</div>)
})}

React：在传递我的onClick函数

1 个答案: