diff --git a/src/pages/Vote/VoteComplete/index.js b/src/pages/Vote/VoteComplete/index.js index ed7c2f7..81d291d 100644 --- a/src/pages/Vote/VoteComplete/index.js +++ b/src/pages/Vote/VoteComplete/index.js @@ -1,5 +1,6 @@ /* eslint-disable import/no-unresolved */ import React from 'react'; +import { useNavigate } from 'react-router-dom'; import { StyledRoot, MainText, @@ -11,6 +12,8 @@ import { } from './style'; function VoteComplete() { + const navigate = useNavigate(); + return ( 투표가 등록되었어요 @@ -18,7 +21,11 @@ function VoteComplete() { 오늘 주경바막 조형예술관에서 허, 불허? - + { + navigate('/'); + }} + > 홈으로 돌아가기 diff --git a/src/pages/Vote/index.js b/src/pages/Vote/index.js index 06ba7a5..495fe19 100644 --- a/src/pages/Vote/index.js +++ b/src/pages/Vote/index.js @@ -1,5 +1,5 @@ /* eslint-disable import/no-unresolved */ -import React from 'react'; +import React, { useState } from 'react'; import { useNavigate } from 'react-router-dom'; import { WhiteLeft } from 'assets'; import { HeaderIcon, PublicButton } from 'components'; @@ -20,6 +20,25 @@ import { function Vote() { const navigate = useNavigate(); + + const [clothesText, setClothesText] = useState(true); + + const changeHandler = () => { + setClothesText(false); + }; + + // const [content, setContent] = useState({ + // clothes: '', + // place: '', + // }); + + // const onChangeContent = e => { + // setContent({ + // ...content, + // [e.target.name]: e.target.value, + // }); + // }; + return ( @@ -51,6 +70,8 @@ function Vote() { name="clothes" placeholder="입고싶은 옷을 적어주세요" required="required" + // onChange={(changeHandler, onChangeContent)} + onChange={changeHandler} /> @@ -61,13 +82,20 @@ function Vote() { type="text" name="place" placeholder="옷을 입고 갈 장소를 적어주세요" + // onChange={onChangeContent} /> 허, 불허? - + { + navigate('/votecomplete'); + }} + text="투표 만들기" + isDisabled={clothesText} + /> ); diff --git a/src/pages/Vote/style.js b/src/pages/Vote/style.js index e46418d..df76ef3 100644 --- a/src/pages/Vote/style.js +++ b/src/pages/Vote/style.js @@ -47,7 +47,7 @@ const BackButton = styled.img` height: 3rem; `; -const Text = styled.p` +const Text = styled.div` width: 100%; display: flex; flex-direction: column;