function App() {
let [글제목,글제목변경] = useState(['남자 코트 추천','강남 우동 맛집','파이썬 독학']);
let month = new Date().getMonth();
let day = new Date().getDate();
let time = new Date().getHours();
let min = new Date().getMinutes();
let sec = new Date().getSeconds();
let today = String(month+1) + "월" + String(day) +"일" + String(time) +"시" + String(min) +"분" + String(sec) + "초";
let [날짜,날짜변경] = useState([today,today,today]);
let [오늘,오늘저장] = useState([0,0,0]);
let [따봉,따봉변경] = useState([0,0,0]);
let [modal, setModal] = useState('false');
let [title, setTilte] = useState(0,1,2);
let [입력값,입력값변경] = useState('');
return (
<div className="App">
<div className="black-nav">
<h4>ReactBlog</h4>
</div>
{
글제목.map(function(a, i){
return (
<div className='list'>
<h4 onClick={ () =>
{ setModal(!modal); setTilte(i); 오늘저장(i); }
}>
{ 글제목[i] }
<span onClick={ (e) => { e.stopPropagation();
let copy = [...따봉]; copy[i] = copy [i] + 1; 따봉변경(copy) }}>🤞 </span> {따봉[i]}</h4>
<p>{날짜[i]}</p>
<button onClick={()=>{
let copy = [...글제목];
copy.splice(i,1);
글제목변경(copy);
}}>삭제</button>
</div>
)
})
}
<input type="text" onInput={ (e) =>
{
입력값변경(e.target.value);
}}>
</input>
<button onClick={ 입력값 == '' ? null : ()=>{
let copy = [...글제목];
copy.unshift(입력값);
글제목변경(copy);
let copy1 = [...따봉];
copy1.unshift(0);
따봉변경(copy1);
let copy2 = [...날짜];
copy2.unshift(today);
날짜변경(copy2);
}}> 추가 </button>
{
modal == true ? <Modal 날짜={날짜} 오늘={오늘} title={title} 글제목={글제목}/> : null
}
</div>
);
}
function Modal(props){
return(
<div className='modal'>
<h4>{props.글제목[props.title]}</h4>
<p>{props.날짜[props.오늘]}</p>
<p>상세내용</p>
<button>글수정</button>
</div>
)
}
이렇게 코드 짜서 1,2,3번 응용문제를 풀어봤습니다 수정해야할부분이있을까요?
