ㅇㅁㅇㅁㅇㅁㅇㅁ

src/Admin.js

-import React, { useState } from 'react';
+import React, { useState, useEffect } from 'react';
 import AdminQuiz from './AdminQuiz'
 import AdminSetting from './AdminSetting'
 
 let QuizBtn = []
-let QnAadmins = []
-
+let QnAadmins
 function Admin() {
 
     const [result, setresult] = useState('')
     const [QuizBtnCount, setQuizBtnCount] = useState(4)
     const [n, setn] = useState(0)
 
+
     function handleClickSetting() {
         setresult(<AdminSetting />)
     }
 
     function handleClickQuiz(e) {
-        setn(e.target.id)
-        console.log(QnAadmins)
-        setresult(<AdminQuiz quizNum={e.target.id} fn={handleClickSave} data={QnAadmins[e.target.id]} />)
+        if (QnAadmins) {
+            let QnAadmins = []
+            setn(e.target.id)
+            setresult(<AdminQuiz quizNum={e.target.id} fn={handleClickSave} data={QnAadmins} />)
+        }
+        else {
+            setn(e.target.id)
+            // let QnAadmins = []
+            let QnAadmins = JSON.parse(localStorage.getItem('QnA'))
+            console.log(QnAadmins)
+            setresult(<AdminQuiz quizNum={e.target.id} fn={handleClickSave} data={QnAadmins[Number(n)]} />)
+        }
     }
 
     function handleClickAddQuiz() {
@@ -28,7 +37,7 @@ function Admin() {
         setQuizBtnCount(QuizBtnCount + 1)
     }
 
-    function handleClickSave(QnAadmin){
+    function handleClickSave(QnAadmin) {
         QnAadmins.splice(n, 0, QnAadmin)
         localStorage.setItem('QnA', JSON.stringify(QnAadmins))
     }

src/AdminQuiz.js

@@ -10,25 +10,6 @@ function AdminQuiz(props) {
     const [choose, setChoose] = useState('')
     const [answer, setAnswer] = useState('')
     const [selectOption, setselectOption] = useState(1)
-    const [q, setq] = useState('')
-    const [c, setc] = useState([])
-    const [a, seta] = useState('')
-
-    useEffect(()=>{
-        setQuestion('')
-        setChoose('')
-        if(props.data){
-            setq(props.data.Q)
-            setc(props.data.Choose)
-            seta(props.data.A)
-        }
-        else {
-            setq('보기를 입력하세요')
-            setc(['보기를 입력하세요','보기를 입력하세요','보기를 입력하세요','보기를 입력하세요'])
-            seta('보기를 입력하세요')
-           
-        }
-    },[props.quizNum])
 
     const handleChangeQuestion = (event) => {
         QnAadmin['Q'] = event.target.value
@@ -53,7 +34,7 @@ function AdminQuiz(props) {
                         <input type="radio" checked={false} name="answer" />
                     </div>
                 </div>
-                <input type="text" class="form-control" id={String(selectOption + 1)} placeholder={c[1]} onChange={handleChangeChoose} />
+                <input type="text" class="form-control" id={String(selectOption + 1)} placeholder="보기를 입력하세요" onChange={handleChangeChoose} />
             </div>
         )
         setselectOption(selectOption + 1)
@@ -88,7 +69,7 @@ function AdminQuiz(props) {
             <div className="p-3 borber">
                 <div className="p-3 ">
                     <span className="font-weight-bold mr-2 h3">1. 문제 입력하기</span>
-                    <input type="text" id="inputQuiz" className="form-control" value={question} onChange={handleChangeQuestion} placeholder={q} />
+                    <input type="text" id="inputQuiz" className="form-control" value={question} onChange={handleChangeQuestion} placeholder="문제를 입력하세요" />
                 </div>
                 <div className="p-3 ">
                     <span className="font-weight-bold mr-2 h3">2. 보기 입력하기</span>
@@ -99,7 +80,7 @@ function AdminQuiz(props) {
                             <input type="radio" checked={false} name="answer" />
                             </div>
                         </div>
-                        <input type="text" className="form-control" id='1'  placeholder={c[0]} onChange={handleChangeChoose} />
+                        <input type="text" className="form-control" id='1'  placeholder="보기를 입력하세요" onChange={handleChangeChoose} />
                     </div>
                     {list.map((element) => element)}
                     <button className="btn btn-outline-secondary btn-sm" onClick={addSelectOption}>+</button>
@@ -108,7 +89,7 @@ function AdminQuiz(props) {
 
                 <div className="p-3 ">
                     <span className="font-weight-bold mr-2 h3">정답:</span>
-                    <input type="text" value={answer} onChange={handleChangeanswer} placeholder={a} />
+                    <input type="text" value={answer} onChange={handleChangeanswer} placeholder="정답을 입력하세요" />
                 </div>
 
                 <label for="inputLogin" className="d-flex justify-content-center">