diff --git a/react_webgame/main/NumberBaseball-class.jsx b/react_webgame/main/NumberBaseball-class.jsx index b9a997ab..8145211d 100644 --- a/react_webgame/main/NumberBaseball-class.jsx +++ b/react_webgame/main/NumberBaseball-class.jsx @@ -1,4 +1,4 @@ -import React, { PureComponent } from 'react'; +import React, { PureComponent, createRef } from 'react'; import Try from './Try-class'; // 숫자 4개를 겹치지않고 랜덤하고 뽑는 함수 @@ -36,6 +36,7 @@ class NumberBaseball extends PureComponent { answer: getNumbers(), tries: [], }); + this.inputRef.current.focus(); } else { const answerArray = value.split('').map((v) => parseInt(v)); let strike = 0; @@ -64,6 +65,7 @@ class NumberBaseball extends PureComponent { value: '', } }); + this.inputRef.current.focus(); } } } @@ -74,10 +76,7 @@ class NumberBaseball extends PureComponent { }) } - input; - onRefInput = (c) => { - this.input = c; - } + inputRef = createRef(); render() { const { result, value, tries } = this.state; @@ -85,7 +84,7 @@ class NumberBaseball extends PureComponent { <>

{result}

- +
시도: {tries.length}
diff --git a/react_webgame/main/NumberBaseball.jsx b/react_webgame/main/NumberBaseball.jsx index 42b36c21..3b8fe210 100644 --- a/react_webgame/main/NumberBaseball.jsx +++ b/react_webgame/main/NumberBaseball.jsx @@ -1,4 +1,4 @@ -import React, { useState, memo } from 'react'; +import React, { useState, useRef, memo } from 'react'; import Try from './Try'; // 숫자 4개를 겹치지않고 랜덤하고 뽑는 함수 @@ -17,7 +17,8 @@ const NumberBaseball = memo(() => { const [value, setvalue] = useState(''); const [answer, setanswer] = useState(getNumbers()); const [tries, settries] = useState([]); - + const inputRef = useRef(null); + const onSubmitForm = (e) => { e.preventDefault(); if(value === answer.join('')) { // 정답 @@ -29,6 +30,7 @@ const NumberBaseball = memo(() => { setvalue(''); setanswer(getNumbers()); settries([]); + inputRef.current.focus(); } else { const answerArray = value.split('').map((v) => parseInt(v)); let strike = 0; @@ -52,6 +54,7 @@ const NumberBaseball = memo(() => { }) setvalue(''); } + inputRef.current.focus(); } } @@ -63,7 +66,7 @@ const NumberBaseball = memo(() => { <>

{result}

- +
시도: {tries.length}
diff --git a/react_webgame/main/client.jsx b/react_webgame/main/client.jsx index 645acf19..ac32f6bc 100644 --- a/react_webgame/main/client.jsx +++ b/react_webgame/main/client.jsx @@ -1,7 +1,7 @@ import React from 'react'; import ReactDom from 'react-dom'; -import Test from './NumberBaseball'; +import Test from './NumberBaseball-class'; ReactDom.render(, document.querySelector('#root')); \ No newline at end of file