Javascript 反应：无法处理事件上的异步函数

当我试图在

h2

中的第二个文件的event onClick上触发异步函数时，遇到了一个问题。 我不知道问题出在哪里。我捕获类型错误

TypeError:无法读取未定义的属性“props”。

只要看看代码

import React from 'react'
import {AngularIntroduce} from './../components/AngularIntroduce'
import {connect} from 'react-redux'

export default connect(
state => ({
    angularData: state.angularData,
    angularReposList: state.angularReposList
}),
dispatch =>  ({
    success: data => dispatch({
        type: 'angularData/FETCH__SUCCESS',
        data: data
    })

})

)(class angularRepoList extends React.Component {



componentDidMount() {

    this.getAngularData()


}

async getAngularData() {
    try {
        const response = await             
fetch('https://api.github.com/orgs/angular');
        const got = await response.json();
        await this.props.success(got)
        console.log(this.props.success)
    }
    catch (err) {
        throw console.log('fetch failed', err);
    }
}

async getAngularContributors() {
    try {
        const response = await 
fetch('https://api.github.com/orgs/angular');
        const got = await response.json();
        await this.props.success(got)
        console.log(this.props.success)
    }
    catch (err) {
        throw console.log('fetch failed', err);
    }
}





render() {


    const angularContributors = this.getAngularContributors
    const angularData = this.props.angularData.data

    console.log(this.props.angularData)
    console.log(angularContributors)

return (
 <AngularIntroduce
     showContributors={angularContributors}
     angularBlog={angularData.blog}
     angularReposCount={angularData.public_repos}
     angularAvatar={angularData.avatar_url}/>

)
}
})

从“React”导入React
从“/../components/AngularIntroduce”导入{AngularIntroduce}
从“react redux”导入{connect}
导出默认连接(
状态=>({
angularData:state.angularData，
AngularRepostList:state.AngularRepostList
}),
分派=>({
成功：数据=>dispatch({
键入：“angularData/FETCH\u SUCCESS”，
数据：数据
})
})
)（类AngularReportList扩展了React.Component{
componentDidMount（）{
这是getAngularData（）
}
异步getAngularData（）{
试一试{
常数响应=等待
取（'https://api.github.com/orgs/angular');
const got=wait response.json（）；
等待这个。道具。成功（得到）
console.log（this.props.success）
}
捕捉（错误）{
抛出console.log（'fetch failed'，err）；
}
}
异步getAngularContributors（）{
试一试{
常数响应=等待
取（'https://api.github.com/orgs/angular');
const got=wait response.json（）；
等待这个。道具。成功（得到）
console.log（this.props.success）
}
捕捉（错误）{
抛出console.log（'fetch failed'，err）；
}
}
render（）{
const AngularContractors=this.GetAngularContractors
const angularData=this.props.angularData.data
console.log（this.props.angularData）
console.log（angularContributors）
返回(
props.showContributors}>看看他们的贡献者！
//在这里，我可以将其更改为仅可用的props.showContributors，但我遇到了一个类似于获取失败的错误
//TypeError:无法读取未定义的属性“props”
)
}

你知道如何获取事件中的数据吗？

---

我可能不知道一些东西

getAngularData

和

getAngularContributors

不知道这是什么意思。您需要做的是在

构造函数中绑定它，如下所示：

constructor(props) {
    super(this);
    this.getAngularData = this.getAngularData.bind(this);
    this.getAngularContributors = this.getAngularContributors.bind(this);
}

componentDidMount( //... rest of code

看见
constructor(props) {
    super(this);
    this.getAngularData = this.getAngularData.bind(this);
    this.getAngularContributors = this.getAngularContributors.bind(this);
}

componentDidMount( //... rest of code