Moving DOM Elements with Teleport

Snippet

Moving DOM Elements with Teleport

The Teleport component allows you to render a part of a component's template into a DOM node that exists outside the component's own hierarchy, such as the end of the <body>.

snippet.js
javascript
<template>
  <Teleport to="body">
    <div class="modal">I am appended to the body tag!</div>
  </Teleport>
</template>

vue

Breakdown

The 'to' attribute specifies the CSS selector of the target destination.

Previous snippet Next snippet

More Beginner JavaScript exercises →

From your library

Moving DOM Elements with Teleport

Related