首页 > 解决方案 > 传递给 onClick 的函数没有完全执行

问题描述

我有一个传递给onClick事件的函数,但它不执行setDisable()以下代码块中的函数:

let [answerClicked, setAnswerClicked] = React.useState()
let [disable, setDisable] = React.useState(true)

const onNextChange = () =>{
    
    if(questionNumber < 9 && disable === false){
        setQuestionNumber((questionNumber) => questionNumber + 1)
        setAnswer((answer) => answer.concat(answerClicked))
    }
}

const getTargetHtml = e => {
    const {target:{outerText}} = e
    const answer = outerText
    answerClicked = {questionId, answer}
    setAnswerClicked(answerClicked)      
    setDisable(false)
}

return(
   <div className='friendeval'>
   <h2 className='friendeval__header'>Friend Evaluation</h2> 
   <div className='friendeval__question-count'>Question {friendEvalData[questionNumber].questionId}/10</div> 
    <div className='align'>
        <img className='friendeval__image'alt='' src={friendEvalData[questionNumber].image}/> 
    </div>
   <div className='friendeval__question'>{friendEvalData[questionNumber].question}</div>
   <div className="friendeval__buttons">
       {

        options.map(option => <button disabled={disable} onClick={getTargetHtml}>{option}</button>)
           
       }
   </div>
   <div className="friendeval__nav">
       <button onClick={onNextChange}>Next</button>
   </div>
</div>
)

一切正常,但setDisable我试图让disable变量切换到false任何时候我点击允许我使用onNextChange处理程序的按钮的功能

标签: javascriptreactjsfunctiondom-eventsreact-dom

解决方案


const getTargetHtml = e => {
    //your code
}
<button  onClick={getTargetHtml} />

这应该可以解决错误。


推荐阅读