October 2024
Beginner to intermediate
452 pages
9h 28m
Korean
Content preview from 실전 코드로 배우는 Vue.js
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
O’Reilly covers everything we've got, with content to help us build a world-class technology community, upgrade the capabilities and competencies of our teams, and improve overall team performance as well as their engagement.I wanted to learn C and C++, but it didn't click for me until I picked up an O'Reilly book. When I went on the O’Reilly platform, I was astonished to find all the books there, plus live events and sandboxes so you could play around with the technology.I’ve been on the O’Reilly platform for more than eight years. I use a couple of learning platforms, but I'm on O'Reilly more than anybody else. When you're there, you start learning. I'm never disappointed.I'm always learning. So when I got on to O'Reilly, I was like a kid in a candy store. There are playlists. There are answers. There's on-demand training. It's worth its weight in gold, in terms of what it allows me to do.
183
CHAPTER 04
컴포넌트 상호작용
4.54.5
텔레포트 텔레포트
APIAPI
컴포넌트를 구현하다 보면 가끔 스타일 제약 조건에 맞추어 엘리먼트를 모아 두어야 하는 경
우가 있다. 이러한 엘리먼트는 컴포넌트 단위가 아닌 전체 화면 효과를 기준으로
DOM
의 특
정 위치에 렌더링해야 한다. 이렇듯 일부 엘리먼트를 원하는 위치로 ‘순간이동’시키는 기능은
대체로 구현하기 복잡하다. 개발 난도가 높고 시간도 오래 걸릴 뿐만 아니라 성능에도 좋지
않은 영향을 미친다. 이러한 순간이동 난제에 대한 해답으로
Vue
는
<
Teleport
>
컴포넌트
를 제시한다.
<
Teleport
>
컴포넌트는
to
라는 속성으로 이동 대상 컴포넌트를 가리킨다. 이 속성은 쿼리
선택자 또는 실제
HTML
엘리먼트를 담고 있다. [예제
4
-
26
]은
Sky
and
clouds
라는 영
역을 지닌
House
컴포넌트다.
Vue
엔진은 이 부분을
#
sky
로 지정된
DOM
엘리먼트로 이동
시킨다.
예제
4-26
House
컴포넌트의
Teleport
<template>
<div>
This is a house
</div>
<Teleport to="#sky">
<div>Sky and clouds</div>
</Teleport>
</template>
App
.
vue
는 [예제
4
-
27
]과 같이
House
컴포넌트를 ...
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Read now
Unlock full access
More than 5,000 organizations count on O’Reilly
O’Reilly covers everything we've got, with content to help us build a world-class technology community, upgrade the capabilities and competencies of our teams, and improve overall team performance as well as their engagement.Julian F.
I wanted to learn C and C++, but it didn't click for me until I picked up an O'Reilly book. When I went on the O’Reilly platform, I was astonished to find all the books there, plus live events and sandboxes so you could play around with the technology.Addison B.
I’ve been on the O’Reilly platform for more than eight years. I use a couple of learning platforms, but I'm on O'Reilly more than anybody else. When you're there, you start learning. I'm never disappointed.Amir M.
I'm always learning. So when I got on to O'Reilly, I was like a kid in a candy store. There are playlists. There are answers. There's on-demand training. It's worth its weight in gold, in terms of what it allows me to do.