react web game : 로또추첨기 - 클래스 컴포넌트

react_webgame/main/Lotto.jsx

@@ -27,7 +27,7 @@ class Lotto extends Component {
 
   timeouts = [];
 
-  componentDidMount() {
+  runTimeouts = () => {
     const { winNumbers } = this.state;
     for (let i = 0; i < this.state.winNumbers.length - 1; i++) {
       this.timeouts[i] = setTimeout(() => {
@@ -44,6 +44,10 @@ class Lotto extends Component {
         redo: true,
       });
     }, 7000);
+  };
+
+  componentDidMount() {
+    this.runTimeouts();
   }
 
   componentWillUnmount() {
@@ -52,6 +56,22 @@ class Lotto extends Component {
     });
   }
 
+  componentDidUpdate(prevProps, prevState) {
+    if (this.state.winBalls.length === 0) {
+      this.runTimeouts();
+    }
+  }
+
+  onClickRedo = () => {
+    this.setState({
+      winNumbers: getWinNumbers(),
+      winBalls: [],
+      bonus: null,
+      redo: false,
+    });
+    this.timeouts = [];
+  };
+
   render() {
     const { winBalls, bonus, redo } = this.state;
     return (