import React, { useState } from 'react' import { Link, Redirect } from 'react-router-dom'; import Timer from 'react-compound-timer'; // 타이머쓰기위해 import import logo from './img_question.png' const QnA = [ { Q: "6 X 4 = ?", Choose: [6, 12, 18, 24], N: 1 }, { Q: "3 + 3 = ?", Choose: [2, 4, 6, 8], N: 2 }, { Q: "3 - 1 = ?", Choose: [1, 2, 3, 4], N: 3 } ] let Answers = [0,0,0] localStorage.setItem('Answers', JSON.stringify(Answers)) let Solutions = [4, 3, 2] localStorage.setItem('Solutions', JSON.stringify(Solutions)) function Quiz() { const [question, setQuestion] = useState({ ...QnA[0] }) const [selected, setSelected] = useState("") //선택한 답을 보여줄 것 const [timeout, settimeout] = useState(false) function handleQuestion() { setQuestion({ ...QnA[question.N]}) setSelected("") //페이지 넘어가면 selected 초기화 } let handleChange = (ev) => { setSelected(ev.target.value) //selected값 변경 Answers[question.N - 1] = Number(ev.target.id) + 1 localStorage.setItem('Answers', JSON.stringify(Answers)) } return ( <>
미적분학 퀴즈

question

{question.Q}
{question.Choose.map((a, index) =>
)}
Your Answer : {selected} {/* 선택한 값 보여줌 */}
{(question.N-1 === QnA.length - 1) ? : }

alert('시간이 초과되었습니다.'), }, { time: 0, callback: () => settimeout(true), } ]} > {() => ( <> : / 30 : 00 )} {/* npm i react-compound-timer */}

{timeout ? : '' } ) } export default Quiz;