저는 글 발행 기능 버튼을 다음과 같이 글제목 배열에 push 메서드로 마지막 요소를 추가했습니다.
그런데 발행된 글 따봉버튼 옆에 기본값 숫자 0 도 안보이더니, 누르면 NaN 이 뜹니다. unshift와 다르게 동작하는 이유가 뭔지 도통 모르겠습니다.
<button onClick={()=>{
let copy = [...글제목];
copy.push(입력값);
글제목변경(copy);
}}>작성</button>
코드 전문
```
</pre>
<pre>
import { useState } from 'react';
import './App.css'</pre>
<pre>
</pre>
<pre>function App() {</pre>
<pre> let [글제목, 글제목변경] = useState(['남자 코트 추천','강남 우동 맛집','파이썬 독학']);
let [따봉, 따봉변경] = useState([0,0,0]); // 따봉은 배열 [ , , ]
let [modal, setModal] = useState(false);
let [title, setTitle] = useState(0);
let [입력값, 입력값변경] = useState('');</pre>
<pre> return (
<div className='App'>
<div className="black-nav">
<h4>ReactBlog</h4>
</div></pre>
<pre> {
글제목.map(function(a,i){
return (
<div className='list' key={i}>
<h4 onClick={()=>{setModal(true); setTitle(i)}}>{글제목[i]}
<span onClick={(e) => {
e.stopPropagation();
let copy = [...따봉];
copy[i] = copy[i] + 1;
따봉변경(copy)}}> 👍</span> {따봉[i]}
</h4>
<p>2월 17일 발행</p>
</div>
)
})
}</pre>
<pre> <input onChange={(e)=>{
입력값변경(e.target.value)
console.log(입력값);
}} /></pre>
<pre> <button onClick={()=>{
let copy = [...글제목];</pre>
<pre> copy.push(입력값);</pre>
<pre> 글제목변경(copy);
}}>작성</button>
{
modal ? <Modal 글제목={글제목} 글제목변경={글제목변경} title={title}/> : null // props 로 글제목, 글제목변경 전달 (App->Modal)
}
</div>
)
}</pre>
<pre>function Modal(props){</pre>
<pre> return(
<div className='modal'>
<h4>{props.글제목[props.title]}</h4>
<p>날짜</p>
<p>상세내용</p>
<button onClick={()=> {props.글제목변경(['여자 코트 추천','강남 우동 맛집','파이썬 독학'])}}>글수정</button>
</div>
)
}</pre>
<pre>
export default App</pre>
<pre>```
