4 글 보임 - 1 에서 4 까지 (총 4 중에서)
-
글쓴이글
-
2024년 1월 31일 18:34 #111999
손하은참가자import "./App.css"; import { useState } from "react";
function App() { let [title, setTitle] = useState([ "남자코트 추천", "강남우동 맛집", "파이썬 독학", ]);
let [like, setLike] = useState([0, 0, 0]); let [modal, setModal] = useState(false); let [Item, setItem] = useState(null); let [write, setWrite] = useState(null);
let likeUp = (index) => { let copy = [...like]; copy[index] = copy[index] + 1; setLike(copy); };
return ( <div className="App"> <div className="black-nav"> <h4>reactBlog</h4> <h4 onClick={() => { let copy = [...title]; copy.sort(); setTitle(copy); }} > 정렬하기 </h4> </div> {title.map((title, index) => { return ( <div key={index} className="list" onClick={() => { setModal(!modal); setItem(title); }} > <button onClick={() => { let copy = [...title]; copy.splice(index, 1); setTitle(copy); console.log(copy); }} > 삭제 </button> <h4> {title} <span onClick={(e) => { e.stopPropagation(); likeUp(index); }} > 👍 </span> {like[index]} </h4> <p> 2월17일 발행</p> </div> ); })}
<button onClick={() => { setModal(!modal); setItem(title[0]); }} > 버튼0 </button> <button onClick={() => { setModal(!modal); setItem(title[1]); }} > 버튼1 </button> <button onClick={() => { setModal(!modal); setItem(title[2]); }} > 버튼2 </button> <input type="text" onChange={(e) => { setWrite(e.target.value); }} /> <button onClick={() => { let copy = [...title]; copy.push(write); setTitle(copy); }} > 글쓰기 </button>
{modal == true ? ( <Modal title={Item} editor={() => { let copy = [...title]; copy[0] = "여자옷"; setTitle(copy); }} /> ) : null} </div> ); }
let Modal = (props) => { return ( <div className="modal"> <h4>{props.title}</h4> <h4>내용</h4> <h4>날짜</h4> <button onClick={props.editor}>수정</button> </div> ); };
export default App;
혼자 이렇게 짰는데 안되길래 선생님 답안 코드 봤는데 똑같은데 왜 안되는건가요 ㅠㅠㅠㅠ?
-
글쓴이글
4 글 보임 - 1 에서 4 까지 (총 4 중에서)
- 답변은 로그인 후 가능합니다.