Reactjs 按钮未启动

我最近自学了javascript、react和nodejs。我遇到一个问题，提交按钮不起作用，但我的其他按钮起作用。我使用Chrome作为浏览器，我也在Firefox中测试了它，但我仍然不起作用。当前，当按下按钮时，它将完全重置状态

我尝试过将函数作为箭头函数传递，引用函数，将按钮移到孩子的外面，使用道具在孩子的里面移动。除了在孩子身上写函数外，其他都是

handleDocs = async () =>{
        console.log('Handle Docs')
        var x = this.state
        if(x.Status==='Approved'){
            var vendorList = []
            var i = 0
            await Axios.get('/staff/'+x['Credit Officer']).then(staff =>{
                x['Credit Officer'] = staff.data[0]['First Name'] + ' ' + staff.data[0]['Last Name']
                    Axios.get('/staff/'+ x['Second Approval']).then(response =>{
                    x['Second Approval'] = response.data[0]['First Name'] + ' ' + response.data[0]['Last Name']          
                    Axios.get('/staff/'+x.application['BDO']).then(response =>{
                        x.application['BDO'] = response.data[0]['First Name'] + ' ' + response.data[0]['Last Name']
                        Axios.post('/genCreditApproval/'+x.AppId, x).then(()=>{
                            Axios.get('return-CreditApproval/'+x.AppId, {responseType: 'blob'}).then((res)=>{
                                const pdfBlob = new Blob([res.data], {type: 'applicaiton/pdf'})
                                saveAs(pdfBlob, x.companyInfo['Company Name'] + ' Credit Aproval.pdf')
                            })

                        })
                        Axios.post('/genCreditScoreCard/'+x.AppId, x).then(()=>{
                            Axios.get('return-CreditScoreCard/'+x.AppId, {responseType: 'blob'}).then((res)=>{
                                const pdfBlob = new Blob([res.data], {type: 'application/pdf'})
                                saveAs(pdfBlob, x.companyInfo['Company Name'] + ' Score Card.pdf')
                            })

                        })
                        if(this.state.source['Source Class']===1){
                            Axios.post("/genCreditApprovalTransmittal/"+x.AppId, x).then(()=>{
                                Axios.get('/return-CreditApprovalTransmittal/'+x.AppId, {responseType: 'blob'}).then((res)=>{
                                    const pdfBlob = new Blob([res.data], {type: 'application/pdf'})
                                    saveAs(pdfBlob, x.companyInfo['Company Name'] + ' Approval Transmittal.pdf')
                                })
                            })
                            Axios.post("/genDocRequestForm/"+this.state.AppId, x).then(()=>{
                                Axios.get("/return-DocRequestForm/"+ this.state.AppId).then((res)=>{
                                    const pdfBlob = new Blob([res.data], {type: 'application/pdf'})
                                    saveAs(pdfBlob, x.companyInfo['Company Name'] + ' Doc Request Form.pdf')
                                })
                            })
                        }
                        else if(this.state.source['Source Class']===2){
                            Axios.post("/genCreditApprovalTransmittalDiscounter/"+this.state.AppId, x).then(()=>{
                                Axios.get('/return-CreditApprovalTransmittal/'+x.AppId, {responseType: 'blob'}).then((res)=>{
                                    const pdfBlob = new Blob([res.data], {type: 'application/pdf'})
                                    saveAs(pdfBlob, x.companyInfo['Company Name'] + ' Approval Transmittal.pdf')
                                })
                            })
                            Axios.post("/genFundingCoverSheet/"+this.state.AppId, x).then(()=>{
                                Axios.get("/return-FundingCoverSheet/"+this.state.AppId,x).then((res)=>{
                                    const pdfBlob = new Blob([res.data], {type: 'application/pdf'})
                                    saveAs(pdfBlob, x.companyInfo['Company Name'] + ' Funding Cover Sheet.pdf')
                                })
                            })
                        }


                    })
                })
            })
        }
    }

render() {
        if(this.state.stage === 0){
            return this.renderCredit();
        }else if(this.state.stage === 1){
            return <Additional nextStage={this.handleNext} handleText={this.handleAdditionalText} handleChange={this.handleAdditional} credit={this.state}  />
        }
        else{
            return <div>
                {this.scoreCard()}
                <br/>
                <button className="btn btn-sm btn-success" onClick={this.handleDocs}>Submit</button>
            </div>
        }
    }

}

handleDocs=async（）=>{
console.log（'handledocs'）
var x=此.state
如果（x.Status===‘已批准’）{
var vendorList=[]
变量i=0
等待Axios.get（'/staff/'+x['creditofficer']），然后（staff=>{
x['Credit Officer']=staff.data[0]['First Name']+''+staff.data[0]['Last Name']
get（'/staff/'+x['Second Approval']）。然后（response=>{
x['Second Approval']=response.data[0]['First Name']+''+response.data[0]['Last Name']
get（'/staff/'+x.application['BDO']），然后（response=>{
x、 应用程序['BDO']=response.data[0]['First Name']+''+response.data[0]['Last Name']
post（'/gencreditaproval/'+x.AppId，x）。然后（（）=>{
get（'return-CreditApproval/'+x.AppId，{responseType:'blob'}）。然后（（res）=>{
const pdfBlob=新Blob（[res.data]，{type:'applicationon/pdf'}）
saveAs（pdfBlob，x.companyInfo['companyname']+'Credit Aproval.pdf'）
})
})
post（'/genCreditScoreCard/'+x.AppId，x）。然后（（）=>{
get（'return-CreditScoreCard/'+x.AppId，{responseType:'blob'}）。然后（（res）=>{
constpdfblob=newblob（[res.data]，{type:'application/pdf'}）
saveAs（pdfBlob，x.companyInfo['companyname']+'Score Card.pdf'）
})
})
if（this.state.source['source Class']==1）{
Axios.post（“/gencreditaprovalTransmission/”+x.AppId，x）。然后（（）=>{
get（'/return creditApprovalTransmital/'+x.AppId，{responseType:'blob'}）。然后（（res）=>{
constpdfblob=newblob（[res.data]，{type:'application/pdf'}）
saveAs（pdfBlob，x.companyInfo['Company Name']+'Approval transmitation.pdf'）
})
})
post（“/genDocRequestForm/”+this.state.AppId，x）。然后（（）=>{
get（“/return DocRequestForm/”+this.state.AppId）。然后（（res）=>{
constpdfblob=newblob（[res.data]，{type:'application/pdf'}）
saveAs（pdfBlob，x.companyInfo['companyname']+'Doc Request Form.pdf'）
})
})
}
else if（this.state.source['source Class']==2）{
Axios.post（“/gencreditaprovaltransmittaldiscenter/”+this.state.AppId，x）。然后（（）=>{
get（'/return creditApprovalTransmital/'+x.AppId，{responseType:'blob'}）。然后（（res）=>{
constpdfblob=newblob（[res.data]，{type:'application/pdf'}）
saveAs（pdfBlob，x.companyInfo['Company Name']+'Approval transmitation.pdf'）
})
})
Axios.post（“/genFundingCoverSheet/”+this.state.AppId，x）。然后（（）=>{
获取（“/return FundingCoverSheet/”+this.state.AppId，x）。然后（（res）=>{
constpdfblob=newblob（[res.data]，{type:'application/pdf'}）
saveAs（pdfBlob，x.companyInfo['Company Name']+'Funding Cover Sheet.pdf'）
})
})
}
})
})
})
}
}
render（）{
if（this.state.stage==0）{
返回此.renderCredit（）；
}else if（this.state.stage==1）{
返回
}
否则{
返回
{this.scoreCard（）}


提交
}
}
}

---

我希望在单击按钮后下载4个pdf。

我认为您的状态正在更改，因为您直接在函数中操作state对象，请按以下方式更改函数

handleDocs = async () =>{
    console.log('Handle Docs')
    var x = { ...this.state}; // create a copy
    // remaining code

---

希望对您有所帮助

我认为您的状态正在更改，因为您直接在函数中操作state对象，请按如下方式更改函数

handleDocs = async () =>{
    console.log('Handle Docs')
    var x = { ...this.state}; // create a copy
    // remaining code

---

希望这能有所帮助。问题是我需要把州提高。一旦我这样做了，我的错误与组件卸载修复本身。简单的初学者错误。现在一切都很好。谢谢大家的帮助

问题是我需要把州升级。一旦我这样做了，我的错误与组件卸载修复本身。简单的初学者错误。现在一切都很好。谢谢大家的帮助

console.log（'Handle Docs'）

此日志是否在您的控制台中？否。这就像onClick事件未触发，然后导致页面崩溃

console.log（'Handle Docs'））

此日志是否存在于您的控制台中？否。这就像onClick事件没有触发，然后页面崩溃。我看到您正在将状态对象直接传递给其他组件，请避免这样做，并查看您是否正在直接更改状态