modalTitle.value = title; 에서 title은 ... - 인프런

인프런 커뮤니티 질문&답변

작성한 질문수

Vue3 완벽 마스터: 기초부터 실전까지 - "실전편"

Teleport 컴포넌트 : Modal 만들기

modalTitle.value = title; 에서 title은 어디서 받아오는거죠?

작성

186

이렇게 작성하고

<div class="col-3 text-muted">제목 :</div>
<div class="col-9">{{ modalTitle }}</div>

이렇게 작성했는데요,

const modalTitle = ref('');
const openModal = ({ title }) => {
	show.value = true;
	modalTitle.value = title;
};

(content, createdAt은 생략했어요)

openModal에서 받아오는 title이

어디서 나오는 건지 모르겠어요.

정상적으로 작동은 되는데 저 부분이 이해가 안돼서요..

title 같은 data들은 fetchPosts() 에서 받아올 때 posts에 넣었으니

modalTitle.value = posts.value.title 이어야 할 것 같은데 왜 이렇게 작성하면 오류가 나고 title만 작성해야 title 데이터가 잘 들어오는건가요..??

답변 1

지식공유자

안녕하세요 :)

Q1) "modalTitle.value = posts.value.title 이어야 할 것 같은데..."

A) 우선 posts는 배열입니다. 배열에서 특정 순번(인덱스, index)에 있는 title을 가져오려면 posts.value[0].title 과 같이 특정 아이템에 접근해서 가져와야 합니다.

Q2) openModal에서 받아오는 title이 어디서 나오는 건지 모르겠어요.

A) openModal 호출하는 코드를 보시면 openModal(item) 특정 아이템을 넘기는 것을 확인할 수 있을거에요. 위 답변(Q1)에서 말씀드렸듯이 특정 아이템(item)에서 title을 가져올 수 있습니다.

Q3) 구조분해할당

혹시 openModal = ({ title }) = { ... } 해당 코드에서 ({ title }) 문법에 대해 잘 모르신다면 구조분해할당(객체 구조 분해) 문법을 한번 보시는 것을 권장드립니다.

감사합니다 🙂

작성한 질문수