/* eslint-disable */
import logo from './logo.svg';
import './App.css';
import { useState } from 'react';
function App() {
let post = '강남 우동 맛집'
let [글제목, 글제목변경] = useState(['남자코트 추천', '강남 우동맛집', '파이썬독학']);
let [따봉, 따봉변경]= useState(0);
let [modal, setModal] = useState('false');
return (
<div className="App">
<div className='black-nav'>
<h4>ReactBlog</h4>
</div>
<button onClick={() => {
let copy2 = [...글제목];
copy2.sort();
글제목변경(copy2);
}}>가나다순 정렬</button>
<button onClick={()=> {
let copy = [...글제목];
copy[0] = '여자코트 추천';
글제목변경(copy);
}}>글 수정</button>
<div className='list'>
<h4>{글제목[0]}<span onClick={() => {
따봉변경(따봉+1)
}}>👍</span> {따봉} </h4>
<p>2월 17일 발행</p>
</div>
<div className='list'>
<h4>{글제목[1]}</h4>
<p>2월 17일 발행</p>
</div>
<div className='list'>
<h4 onClick={() => {
{setModal(!modal)}
}}>{글제목[2]}</h4>
<p>2월 17일 발행</p>
</div>
{modal == true ? <Modal></Modal> : null}
</div>
);
}
function Modal (){
return(
<div className='modal'>
<h4>제목</h4>
<p>날짜</p>
<p>상세내용</p>
</div>
)
}
export default App;
제가 여기서 글 수정 버튼을 누르면 지금은 '남자코트 추천'에서 '여자코트 추천'으로 바뀌는데,
다시 글 수정 버튼을 눌렀을때, '여자코트 추천'이 다시 '남자코트 추천'으로 변하는 기능을 만들고 싶은데,
이게 배열이다보니 어떤식으로 접근을 해야하는지 감이 잘 안와서요..ㅠ 힌트 좀 얻을 수 있을까요..!?
