저.. 왜 리셋버튼이 작동을 안할까요?

Question

import React , { Component } from 'react' ; class ResponseCheck extends Component { state = { state : 'waiting' , message : '클릭해서 시작하세요.' , result : [], }; timeout ; startTime ; endTime ; onClickScreen = () => { const { state } = this . state ; if ( state === 'waiting' ) { timeout . current = setTimeout (() => { this . setState ({ state : 'now' , message : '지금 클릭' , }); this . startTime = new Date (); }, Math . floor ( Math . random () * 1000 ) + 2000 ); // 2초~3초 랜덤 this . setState ({ state : 'ready' , message : '초록색이 되면 클릭하세요.' , }); } else if ( state === 'ready' ) { // 성급하게 클릭 clearTimeout ( this . timeout ); this . setState ({ state : 'waiting' , message : '너무 성급하시군요! 초록색이 된 후에 클릭하세요.' , }); } else if ( state === 'now' ) { // 반응속도 체크 endTime . current = new Date (); this . setState (( prevState ) => { return { state : 'waiting' , message : '클릭해서 시작하세요.' , result : [... prevState . result , this . endTime , this . startTime ], }; }); } }; onReset = () => { this . setState ({ result : [], }); }; renderAverage = () => { const { result } = this . state ; return result . length === 0 ? null : <> < div > 평균 시간: { result . reduce (( a , c ) => a + c ) / result . length } ms < button onClick = {this . onReset } > 리셋 }; render () { const { state , message } = this . state ; return ( <> < div id = "screen" className = { state } onClick = {this . onClickScreen } > { message } { this . renderAverage () } ) } } export default ResponseCheck ; < html lang = "ko" > < head > < meta charset = "utf-8" > < title > game < style > #screen { width : 300px ; height : 200px ; text-align : center ; user-select : none ; } #screen.waiting { background-color : #5a985c ; } #screen.ready { background-color : #dc7171 ; color : white ; } #screen.now { background-color : #acd674 ; } < body > < div id = "root" > < script src = "./dist/app.js" >

제로초(조현영) · Answer

onReset 안에 콘솔로그를 넣어 onReset 함수 자체가 실행되는지 체크해보세요.