props 스프레드 문법

[전태헌]

props를 응용한 상세페이지 강의 부분에서요

{모달 == true ? <Modal 글제목변경 ={글제목변경} 글제목 = {글제목}/> : null}


function Modal(props) {
return (
<>
<div className="modal">
<h4> {props.글제목} </h4>
<p> 날짜 </p>
<p> 상세내용 </p>
<button onClick={() => {
let copy = {...글제목};
copy[0] = '글제목 1 변경';
{props.글제목변경(copy)}
}}> 버튼 </button>
</div>
</>
);
}


선생님이 강의에서 알려주시다가 이건 여러분이 해보라고 하셨던 부분을 한번 해보고있는데, 
스프레드 문법을 짜서 한번 해봤는데 작동을 안해서요.. 

어디부분이 잘못된것인지 잘 모르겠습니다

그리고 만약에 자식컴포넌트에서 {props.글제목}  이런식으로 props로 한번 전송해주고 나서 

똑같은 state를 자식컴포넌트 내에서 또 쓴다고 가정하면 또 props로 해주어야하는건가요??

let copy = {...prosp.글제목} 이렇게 해봤는데도 안되는데 어느 부분을 고쳐줘야하는건지 감이 잘 안잡힙니다

[codingapple]

props.글제목이 일반 글자면 ... 쓰거나 그럴 필요 없습니다 array 혹은 object에만 씁시다

[전태헌]

function Modal(props) {
let [제목, 제목변경] = useState([props.글제목]);
let [글순서, 글순서변경] = useState(props.title);

return (
<>
{제목.map((a, i) => {
return (
<div className="modal" key={i}>
<h4> {제목[i]} </h4>
<p> 날짜 </p>
<p> 상세내용 </p>
<button>버튼</button>
</div>
 );
})}
</>
 );
}

아니면 이것을 모달 컴포넌트 안에 state로 또 받아서 변경해주려고 했는데 
이번에는 글제목1글제목2글제목3 이렇게 출력이되는데... 이건 또 어느부분이 잘못된걸까요ㅠ?

[codingapple]

props는 state에 담아서 쓰진 않습니다 그냥 그대로 씁시다 
state 변경은 부모 -> 자식으로 state변경함수 보내서 자식이 그거 쓰면 됩니다

[글쓴이]

글