Skip to content
GitLab
Menu
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
students
online-quiz-react
Commits
a683b650
Commit
a683b650
authored
Aug 19, 2020
by
baesangjune
Browse files
.
parent
ae61698c
Changes
2
Hide whitespace changes
Inline
Side-by-side
src/Admin.js
View file @
a683b650
...
...
@@ -25,7 +25,7 @@ function Admin() {
// console.log(dbRef.current, indexRef.current)
if
(
dbRef
.
current
[
e
.
target
.
id
-
1
]){
setresult
(
<
AdminQuiz
quizNum
=
{
e
.
target
.
id
}
fn
=
{
handleClickSave
}
data
=
{
dbRef
.
current
[
e
.
target
.
id
-
1
]}
/>
)
setresult
(
<
AdminQuiz
quizNum
=
{
e
.
target
.
id
}
fn
=
{
handleClickSave
}
data
=
{
dbRef
.
current
[
e
.
target
.
id
-
1
]}
/>
)
/
/
설명
부탇드립니다
.
}
else
{
dbRef
.
current
[
e
.
target
.
id
-
1
]
=
{
'
Q
'
:
'
x
'
,
'
Choose
'
:[
0
,
0
,
0
,
0
],
'
A
'
:
'
x
'
}
...
...
@@ -38,14 +38,14 @@ function Admin() {
<
button
type
=
'
button
'
className
=
'
btn btn-outline-primary
'
id
=
{
QuizBtnCount
}
onClick
=
{
handleClickQuiz
}
>
Quiz
{
QuizBtnCount
}
<
/button
>
)
setQuizBtnCount
(
QuizBtnCount
+
1
)
}
}
//퀴즈 추가버튼
function
handleClickSave
(
QnAadmin
)
{
console
.
log
(
QnAadmin
,
indexRef
.
current
)
dbRef
.
current
[
indexRef
.
current
]
=
QnAadmin
localStorage
.
setItem
(
'
QnA
'
,
JSON
.
stringify
(
dbRef
.
current
))
}
}
//설명 부탁드립니다.
return
(
<>
<
div
className
=
"
container-fluid bg-light
"
>
...
...
src/AdminQuiz.js
View file @
a683b650
import
React
,
{
useState
}
from
'
react
'
;
import
React
,
{
useState
,
useEffect
}
from
'
react
'
;
let
list
=
[]
let
QnAadmins
=
[]
let
QnAadmin
=
{}
let
savechoose
=
{}
function
AdminQuiz
(
props
)
{
const
[
question
,
setQuestion
]
=
useState
(
props
.
data
.
Q
)
// setQuestion(props.data.Q)
// question = props.data.Q
const
[
choose
,
setChoose
]
=
useState
(
props
.
data
.
Choose
)
// setChoose(props.data.Choose)
// choose = props.data.Choose
const
[
answer
,
setAnswer
]
=
useState
(
props
.
data
.
A
)
// setAnswer(props.data.A)
// answer = props.data.A
const
[
selectOption
,
setselectOption
]
=
useState
(
1
)
// props.quizNum가 바뀔때마다 즉, Admin.js에서 퀴즈버튼을 바꿔누를때마다 useEffect가 발생하여 값을 업데이트 시켜줍니다.
useEffect
(()
=>
{
setQuestion
(
props
.
data
.
Q
)
setChoose
(
props
.
data
.
Choose
)
setAnswer
(
props
.
data
.
A
)
},[
props
.
quizNum
])
// 만약 업데이트가 되었으면 question이랑 props.data.Q랑 값이 같아야 하는데
// admin페이지 가서 quiz 1에 값들 넣은 다음 콘솔찍어보고 quiz 2에도 값을 넣고 콘솔보면 어떤게 다른지 알 수 있을거야
// 마지막으로 quiz3 눌러보면 확실하게 알 수 있을거고 값이 처음만 업데이트되고 나중에는 업데이트가 안되고있어
console
.
log
(
question
)
console
.
log
(
props
.
data
.
Q
)
console
.
log
(
choose
)
console
.
log
(
props
.
data
.
Choose
)
console
.
log
(
answer
)
console
.
log
(
props
.
data
.
A
)
const
handleChangeQuestion
=
(
event
)
=>
{
QnAadmin
[
'
Q
'
]
=
event
.
target
.
value
setQuestion
(
event
.
target
.
value
)
}
const
handleChangeChoose
=
(
event
)
=>
{
savechoose
[
event
.
target
.
id
]
=
event
.
target
.
value
setChoose
(
event
.
target
.
value
)
}
const
handleChangeanswer
=
(
event
)
=>
{
QnAadmin
[
'
A
'
]
=
event
.
target
.
value
setAnswer
(
event
.
target
.
value
)
...
...
@@ -68,57 +60,49 @@ function AdminQuiz(props) {
alert
(
'
정답이 입력되지 않았습니다.
'
)
}
else
{
// console.log(QnAadmin)
QnAadmin
[
'
Choose
'
]
=
Object
.
values
(
savechoose
)
QnAadmin
[
'
N
'
]
=
String
(
props
.
Q
uizNum
)
QnAadmins
.
push
(
QnAadmin
)
QnAadmin
[
'
N
'
]
=
String
(
props
.
q
uizNum
)
props
.
fn
(
QnAadmin
)
QnAadmin
=
{}
localStorage
.
setItem
(
'
QnA
'
,
JSON
.
stringify
(
QnAadmins
))
// console.log(QnAadmins)
alert
(
'
입력이 완료되었습니다.
'
)
}
}
// function handleChangeQuestion(){}
return
(
<>
<
div
className
=
""
id
=
"
Quiz1
"
>
<
h2
className
=
"
p-3 border text-center
"
>
{
String
(
props
.
QuizNum
)}
번
문제만들기
<
/h2
>
<
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
"
onChange
=
{
handleChangeQuestion
}
value
=
{
question
}
placeholder
=
{
'
문제를 입력하세요
'
}
><
/input
>
<
/div
>
<
div
className
=
""
id
=
"
Quiz1
"
>
<
h2
className
=
"
p-3 border text-center bg-white
"
>
{
String
(
props
.
quizNum
)}
번
문제만들기
<
/h2
>
<
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
=
"
문제를 입력하세요
"
/>
<
/div
>
<
div
className
=
"
p-3
"
>
<
span
className
=
"
font-weight-bold mr-2 h3
"
>
2
.
보기
입력하기
<
/span
>
<
div
className
=
"
p-3
"
>
<
span
className
=
"
font-weight-bold mr-2 h3
"
>
2
.
보기
입력하기
<
/span
>
<
div
className
=
"
p-3
"
>
<
div
className
=
"
input-group
"
>
<
div
className
=
"
input-group-prepend
"
>
<
div
className
=
"
input-group-text
"
>
<
input
type
=
"
radio
"
checked
=
{
false
}
name
=
"
answer
"
/>
<
/div
>
<
div
className
=
"
input-group
"
>
<
div
className
=
"
input-group-prepend
"
>
<
div
className
=
"
input-group-text
"
>
<
input
type
=
"
radio
"
checked
=
{
false
}
name
=
"
answer
"
/>
<
/div
>
<
input
type
=
"
text
"
className
=
"
form-control
"
id
=
'
1
'
value
=
{
choose
}
placeholder
=
{
'
1번 보기를 입력하세요
'
}
onChange
=
{
handleChangeChoose
}
/
>
<
/div
>
{
list
.
map
((
element
)
=>
element
)}
<
button
className
=
"
btn btn-outline-secondary btn-sm
"
onClick
=
{
addSelectOption
}
>+<
/button
>
<
input
type
=
"
text
"
className
=
"
form-control
"
id
=
'
1
'
value
=
{
choose
}
placeholder
=
"
보기를 입력하세요
"
onChange
=
{
handleChangeChoose
}
/
>
<
/div
>
{
list
.
map
((
element
)
=>
element
)}
<
button
className
=
"
btn btn-outline-secondary btn-sm
"
onClick
=
{
addSelectOption
}
>+<
/button
>
<
/div
>
<
/div
>
<
div
className
=
"
p-3
"
>
<
span
className
=
"
font-weight-bold mr-2 h3
"
>
정답
:
<
/span
>
<
input
type
=
"
text
"
onChange
=
{
handleChangeanswer
}
value
=
{
answer
}
placeholder
=
{
'
정답를 입력하세요
'
}
/
>
<
/div
>
<
label
for
=
"
inputLogin
"
className
=
"
d-flex justify-content-center
"
>
<
button
className
=
"
mt-4 btn btn-dark
"
onClick
=
{
handleClick
}
>
작성완료
<
/button
>
<
/label
>
<
div
className
=
"
p-3
"
>
<
span
className
=
"
font-weight-bold mr-2 h3
"
>
정답
:
<
/span
>
<
input
type
=
"
text
"
value
=
{
answer
}
onChange
=
{
handleChangeanswer
}
placeholder
=
"
정답을 입력하세요
"
/>
<
/div
>
<
label
for
=
"
inputLogin
"
className
=
"
d-flex justify-content-center
"
>
<
button
className
=
"
mt-4 btn btn-dark
"
onClick
=
{
handleClick
}
>
작성완료
<
/button
>
<
/label
>
<
/div
>
<
/
>
<
/
div
>
)
}
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment