CINXE.COM

<!DOCTYPE html> <html lang="ja" dir="ltr"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1"> <title>用語集 | Vue.js</title> <meta name="description" content="Vue.js - The Progressive JavaScript Framework"> <meta name="generator" content="VitePress v1.6.3"> <link rel="preload stylesheet" href="/assets/style.DTqApQSB.css" as="style"> <link rel="preload stylesheet" href="/vp-icons.css" as="style"> <script type="module" src="/assets/app.uD9gd7UQ.js"></script> <link rel="modulepreload" href="/assets/chunks/theme.CdQsN2Jw.js"> <link rel="modulepreload" href="/assets/chunks/framework.CgnSSfjO.js"> <link rel="modulepreload" href="/assets/glossary_index.md.CRau0nne.lean.js"> <link rel="icon" href="/logo.svg"> <meta name="theme-color" content="#3c8772"> <meta property="og:url" content="https://vuejs.org/"> <meta property="og:type" content="website"> <meta property="og:title" content="Vue.js"> <meta property="og:description" content="Vue.js - The Progressive JavaScript Framework"> <meta property="og:image" content="https://vuejs.org/images/logo.png"> <meta name="twitter:site" content="@vuejs"> <meta name="twitter:card" content="summary"> <link rel="preconnect" href="https://automation.vuejs.org"> <script>(()=>{const e=(o,r,c=!1)=>{const s=localStorage.getItem(o);(s?s!=="false":c)&&document.documentElement.classList.add(r)};e("vue-docs-prefer-composition","prefer-composition",!0),e("vue-docs-prefer-sfc","prefer-sfc",!0),window.__VUE_BANNER_ID__="vueconf2025",e(`vue-docs-banner-${__VUE_BANNER_ID__}`,"banner-dismissed")})();</script> <script>location.search.includes("?uwu")&&document.documentElement.classList.add("uwu");</script> <script src="https://cdn.usefathom.com/script.js" data-site="NJTQDIQA" data-spa="auto" defer></script> <script src="https://vueschool.io/banner.js?affiliate=vuejs&type=top" async></script> <script>(t=>{window.rum={key:"a9efvfeu"};var e=t.createElement("script");e.src="/rom3.min.js",e.type="text/javascript",e.defer=!0,e.async=!0,t.getElementsByTagName("head")[0].appendChild(e)})(document);</script> <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script> <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script> <link rel="preload" href="/assets/inter-roman-latin.Di8DUHzh.woff2" as="font" type="font/woff2" crossorigin=""> </head> <body> <div id="app"><div class="VPApp" data-v-6a43a5bf><span tabindex="-1" data-v-720d35af></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-720d35af>本文へジャンプ</a><div class="banner" data-v-f1f9c6d9><p class="vt-banner-text" data-v-f1f9c6d9><span class="vt-text-primary" data-v-f1f9c6d9> Vueconf.US </span><span class="vt-tagline" data-v-f1f9c6d9> · The official Vue.js conf</span><span class="vt-place" data-v-f1f9c6d9> · Tampa, USA</span><span class="vt-date" data-v-f1f9c6d9> · 19-21 May 2025</span><a target="_blank" class="vt-primary-action" href="https://vueconf.us/?utm_source=vuejs&utm_content=top_banner" data-v-f1f9c6d9> Register </a></p><button data-v-f1f9c6d9><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="close" data-v-f1f9c6d9><path d="M18.9,10.9h-6v-6c0-0.6-0.4-1-1-1s-1,0.4-1,1v6h-6c-0.6,0-1,0.4-1,1s0.4,1,1,1h6v6c0,0.6,0.4,1,1,1s1-0.4,1-1v-6h6c0.6,0,1-0.4,1-1S19.5,10.9,18.9,10.9z"></path></svg></button><p class="vt-banner-text vt-coupon" data-v-f1f9c6d9><span class="vt-text-primary" data-v-f1f9c6d9>Use</span> VUEJSDOCS <span class="vt-text-primary" data-v-f1f9c6d9> $200 off</span></p></div><header class="VPNav nav-bar stick" data-v-6a43a5bf data-v-82cf57fe><div class="VPNavBar" data-v-82cf57fe data-v-3eb3e878><div class="container" data-v-3eb3e878><a class="VPNavBarTitle" href="/" data-v-3eb3e878 data-v-676e0d67><svg class="logo" viewBox="0 0 128 128" width="24" height="24" data-v-676e0d67><path fill="#42b883" d="M78.8,10L64,35.4L49.2,10H0l64,110l64-110C128,10,78.8,10,78.8,10z" data-v-676e0d67></path><path fill="#35495e" d="M78.8,10L64,35.4L49.2,10H25.6L64,76l38.4-66H78.8z" data-v-676e0d67></path></svg><span class="text" data-v-676e0d67>Vue.js</span></a><div class="content" data-v-3eb3e878><div class="VPNavBarSearch search" data-v-3eb3e878><div id="docsearch"><button type="button" class="DocSearch DocSearch-Button" aria-label="検索"><span class="DocSearch-Button-Container"><svg width="20" height="20" class="DocSearch-Search-Icon" viewBox="0 0 20 20"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">検索</span></span></button></div></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-3eb3e878 data-v-58865203><span id="main-nav-aria-label" class="visually-hidden" data-v-58865203>メイン・ナビゲーション</span><div class="vt-flyout VPNavBarMenuGroup" data-v-58865203 data-v-4422aa59><button type="button" class="vt-flyout-button" aria-haspopup="true" aria-expanded="false"><span class="vt-flyout-button-text">ドキュメント <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-flyout-button-text-icon"><path d="M12,16c-0.3,0-0.5-0.1-0.7-0.3l-6-6c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l5.3,5.3l5.3-5.3c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-6,6C12.5,15.9,12.3,16,12,16z"></path></svg></span></button><div class="vt-flyout-menu"><div class="vt-menu"><div class="vt-menu-items"><a class="vt-link link vt-menu-link" href="/guide/introduction.html">ガイド</a><a class="vt-link link vt-menu-link" href="/tutorial/">チュートリアル</a><a class="vt-link link vt-menu-link" href="/examples/">実装例</a><a class="vt-link link vt-menu-link" href="/guide/quick-start.html">クイックスタート</a><a class="vt-link link vt-menu-link" href="/glossary/">用語集</a><a class="vt-link link vt-menu-link" href="/error-reference/">エラーリファレンス</a><a class="vt-link link vt-menu-link" href="https://v2.ja.vuejs.org" target="_blank" rel="noopener noreferrer">Vue 2 のドキュメント<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a class="vt-link link vt-menu-link" href="https://v3-migration.vuejs.org/ja/" target="_blank" rel="noopener noreferrer">Vue 2 からの移行<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a></div></div></div></div><a class="vt-link link VPNavBarMenuLink" href="/api/" data-v-58865203 data-v-766ef308>API</a><a class="vt-link link VPNavBarMenuLink" href="https://play.vuejs.org" target="_blank" rel="noopener noreferrer" data-v-58865203 data-v-766ef308>プレイグラウンド</a><div class="vt-flyout VPNavBarMenuGroup" data-v-58865203 data-v-4422aa59><button type="button" class="vt-flyout-button" aria-haspopup="true" aria-expanded="false"><span class="vt-flyout-button-text">エコシステム <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-flyout-button-text-icon"><path d="M12,16c-0.3,0-0.5-0.1-0.7-0.3l-6-6c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l5.3,5.3l5.3-5.3c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-6,6C12.5,15.9,12.3,16,12,16z"></path></svg></span></button><div class="vt-flyout-menu"><div class="vt-menu"><div class="vt-menu-items"><div class="vt-menu-group"><p class="vt-menu-group-title">リソース</p><a class="vt-link link vt-menu-link" href="/partners/">パートナー</a><a class="vt-link link vt-menu-link" href="/developers/">デベロッパー</a><a class="vt-link link vt-menu-link" href="/ecosystem/themes.html">テーマ</a><a class="vt-link link vt-menu-link" href="https://ui-libs.vercel.app/" target="_blank" rel="noopener noreferrer">UI コンポーネント<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a class="vt-link link vt-menu-link" href="https://certificates.dev/vuejs/?ref=vuejs-nav" target="_blank" rel="noopener noreferrer">検定<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a class="vt-link link vt-menu-link" href="https://vuejobs.com/?ref=vuejs" target="_blank" rel="noopener noreferrer">仕事<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a class="vt-link link vt-menu-link" href="https://vue.threadless.com/" target="_blank" rel="noopener noreferrer">T シャツショップ<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a></div><div class="vt-menu-group"><p class="vt-menu-group-title">公式ライブラリー</p><a class="vt-link link vt-menu-link" href="https://router.vuejs.org/" target="_blank" rel="noopener noreferrer">Vue Router<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a class="vt-link link vt-menu-link" href="https://pinia.vuejs.org/" target="_blank" rel="noopener noreferrer">Pinia<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a class="vt-link link vt-menu-link" href="/guide/scaling-up/tooling.html">ツールガイド</a></div><div class="vt-menu-group"><p class="vt-menu-group-title">動画講座</p><a class="vt-link link vt-menu-link" href="https://www.vuemastery.com/courses/" target="_blank" rel="noopener noreferrer">Vue Mastery<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a class="vt-link link vt-menu-link" href="https://vueschool.io/?friend=vuejs&utm_source=Vuejs.org&utm_medium=Link&utm_content=Navbar%20Dropdown" target="_blank" rel="noopener noreferrer">Vue School<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a></div><div class="vt-menu-group"><p class="vt-menu-group-title">ヘルプ</p><a class="vt-link link vt-menu-link" href="https://discord.com/invite/HBherRA" target="_blank" rel="noopener noreferrer">Discord Chat<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a class="vt-link link vt-menu-link" href="https://github.com/vuejs/core/discussions" target="_blank" rel="noopener noreferrer">GitHub Discussions<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a class="vt-link link vt-menu-link" href="https://dev.to/t/vue" target="_blank" rel="noopener noreferrer">DEV Community<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a></div><div class="vt-menu-group"><p class="vt-menu-group-title">ニュース</p><a class="vt-link link vt-menu-link" href="https://blog.vuejs.org/" target="_blank" rel="noopener noreferrer">ブログ<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a class="vt-link link vt-menu-link" href="https://twitter.com/vuejs" target="_blank" rel="noopener noreferrer">Twitter<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a class="vt-link link vt-menu-link" href="https://events.vuejs.org/" target="_blank" rel="noopener noreferrer">イベント<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a class="vt-link link vt-menu-link" href="/ecosystem/newsletters.html">ニュースレター</a></div></div></div></div></div><div class="vt-flyout VPNavBarMenuGroup" data-v-58865203 data-v-4422aa59><button type="button" class="vt-flyout-button" aria-haspopup="true" aria-expanded="false"><span class="vt-flyout-button-text">情報 <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-flyout-button-text-icon"><path d="M12,16c-0.3,0-0.5-0.1-0.7-0.3l-6-6c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l5.3,5.3l5.3-5.3c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-6,6C12.5,15.9,12.3,16,12,16z"></path></svg></span></button><div class="vt-flyout-menu"><div class="vt-menu"><div class="vt-menu-items"><a class="vt-link link vt-menu-link" href="/about/faq.html">FAQ</a><a class="vt-link link vt-menu-link" href="/about/team.html">チーム</a><a class="vt-link link vt-menu-link" href="/about/releases.html">リリース</a><a class="vt-link link vt-menu-link" href="/about/community-guide.html">コミュニティーガイド</a><a class="vt-link link vt-menu-link" href="/about/coc.html">行動規範</a><a class="vt-link link vt-menu-link" href="/about/privacy.html">プライバシーポリシー</a><a class="vt-link link vt-menu-link" href="https://www.youtube.com/watch?v=OrxmtDw4pVI" target="_blank" rel="noopener noreferrer">ドキュメンタリー<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a></div></div></div></div><a class="vt-link link VPNavBarMenuLink" href="/sponsor/" data-v-58865203 data-v-766ef308>スポンサー</a><div class="vt-flyout VPNavBarMenuGroup" data-v-58865203 data-v-4422aa59><button type="button" class="vt-flyout-button" aria-haspopup="true" aria-expanded="false"><span class="vt-flyout-button-text">エキスパート <span class="vt-menu-badge">NEW</span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-flyout-button-text-icon"><path d="M12,16c-0.3,0-0.5-0.1-0.7-0.3l-6-6c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l5.3,5.3l5.3-5.3c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-6,6C12.5,15.9,12.3,16,12,16z"></path></svg></span></button><div class="vt-flyout-menu"><div class="vt-menu"><div class="vt-menu-items"><a class="vt-link link vt-menu-link" href="/partners/">パートナー</a><a class="vt-link link vt-menu-link" href="/developers/">デベロッパー<span class="vt-menu-badge">NEW</span></a></div></div></div></div><div class="vt-flyout VPNavBarMenuGroup active VPNavBarLocale" data-v-58865203 data-v-37e024a3><button type="button" class="vt-flyout-button" aria-haspopup="true" aria-expanded="false" aria-label="Select Language"><div class="vt-locales-btn-icon-container" data-v-37e024a3><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-locales-btn-icon" data-v-37e024a3><path d="M0 0h24v24H0z" fill="none"></path><path d=" M12.87 15.07l-2.54-2.51.03-.03c1.74-1.94 2.98-4.17 3.71-6.53H17V4h-7V2H8v2H1v1.99h11.17C11.5 7.92 10.44 9.75 9 11.35 8.07 10.32 7.3 9.19 6.69 8h-2c.73 1.63 1.73 3.17 2.98 4.56l-5.09 5.02L4 19l5-5 3.11 3.11.76-2.04zM18.5 10h-2L12 22h2l1.12-3h4.75L21 22h2l-4.5-12zm-2.62 7l1.62-4.33L19.12 17h-3.24z " class="css-c4d79v"></path></svg></div></button><div class="vt-flyout-menu"><div class="vt-menu"><div class="vt-menu-items x-padding" data-v-37e024a3><div class="vt-locales-menu-item"><a href="https://vuejs.org/glossary/" target="_blank" class="vt-locales-menu-item-text">English <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a href="https://github.com/vuejs/docs" title="English Repository" target="_blank" class="vt-locales-btn-icon-container"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-locales-btn-icon repo"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></a></div><div class="vt-locales-menu-item"><a href="https://cn.vuejs.org/glossary/" target="_blank" class="vt-locales-menu-item-text">简体中文 <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a href="https://github.com/vuejs-translations/docs-zh-cn" title="简体中文 Repository" target="_blank" class="vt-locales-btn-icon-container"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-locales-btn-icon repo"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></a></div><div class="vt-locales-menu-item"><a href="https://ua.vuejs.org/glossary/" target="_blank" class="vt-locales-menu-item-text">Українська <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a href="https://github.com/vuejs-translations/docs-uk" title="Українська Repository" target="_blank" class="vt-locales-btn-icon-container"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-locales-btn-icon repo"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></a></div><div class="vt-locales-menu-item"><a href="https://fr.vuejs.org/glossary/" target="_blank" class="vt-locales-menu-item-text">Français <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a href="https://github.com/vuejs-translations/docs-fr" title="Français Repository" target="_blank" class="vt-locales-btn-icon-container"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-locales-btn-icon repo"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></a></div><div class="vt-locales-menu-item"><a href="https://ko.vuejs.org/glossary/" target="_blank" class="vt-locales-menu-item-text">한국어 <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a href="https://github.com/vuejs-translations/docs-ko" title="한국어 Repository" target="_blank" class="vt-locales-btn-icon-container"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-locales-btn-icon repo"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></a></div><div class="vt-locales-menu-item"><a href="https://pt.vuejs.org/glossary/" target="_blank" class="vt-locales-menu-item-text">Português <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a href="https://github.com/vuejs-translations/docs-pt" title="Português Repository" target="_blank" class="vt-locales-btn-icon-container"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-locales-btn-icon repo"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></a></div><div class="vt-locales-menu-item"><a href="https://bn.vuejs.org/glossary/" target="_blank" class="vt-locales-menu-item-text">বাংলা <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a href="https://github.com/vuejs-translations/docs-bn" title="বাংলা Repository" target="_blank" class="vt-locales-btn-icon-container"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-locales-btn-icon repo"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></a></div><div class="vt-locales-menu-item"><a href="https://it.vuejs.org/glossary/" target="_blank" class="vt-locales-menu-item-text">Italiano <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a href="https://github.com/vuejs-translations/docs-it" title="Italiano Repository" target="_blank" class="vt-locales-btn-icon-container"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-locales-btn-icon repo"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></a></div><div class="vt-locales-menu-item"><a href="https://fa.vuejs.org/glossary/" target="_blank" class="vt-locales-menu-item-text">فارسی <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a href="https://github.com/vuejs-translations/docs-fa" title="فارسی Repository" target="_blank" class="vt-locales-btn-icon-container"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-locales-btn-icon repo"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></a></div><div class="vt-locales-menu-item"><a href="https://ru.vuejs.org/glossary/" target="_blank" class="vt-locales-menu-item-text">Русский <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a href="https://github.com/translation-gang/docs-ru" title="Русский Repository" target="_blank" class="vt-locales-btn-icon-container"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-locales-btn-icon repo"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></a></div><div class="vt-locales-menu-item"><a href="https://cs.vuejs.org/glossary/" target="_blank" class="vt-locales-menu-item-text">Čeština <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a href="https://github.com/vuejs-translations/docs-cs" title="Čeština Repository" target="_blank" class="vt-locales-btn-icon-container"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-locales-btn-icon repo"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></a></div><div class="vt-locales-menu-item"><a href="https://zh-hk.vuejs.org/glossary/" target="_blank" class="vt-locales-menu-item-text">繁體中文 <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a href="https://github.com/vuejs-translations/docs-zh-hk" title="繁體中文 Repository" target="_blank" class="vt-locales-btn-icon-container"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-locales-btn-icon repo"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></a></div><div class="vt-locales-menu-item"><a href="https://pl.vuejs.org/glossary/" target="_blank" class="vt-locales-menu-item-text">Polski <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="vt-link-icon"><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a><a href="https://github.com/vuejs-translations/docs-pl" title="Polski Repository" target="_blank" class="vt-locales-btn-icon-container"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-locales-btn-icon repo"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></a></div></div><div class="vt-locales-menu-hr-divider" data-v-bb5f9e1b></div><div class="vt-locales-menu-item join-translations" data-v-bb5f9e1b><div role="link" tabindex="0" class="vt-locales-menu-item-text" data-v-bb5f9e1b>翻訳にご協力ください！</div></div></div></div></div></nav><div class="VPNavBarAppearance appearance" data-v-3eb3e878 data-v-cfdc4d5b><button class="vt-switch vt-switch-appearance" type="button" role="switch" aria-label="ダークモードの切り替え" aria-checked="false" data-v-cfdc4d5b><span class="vt-switch-check"><span class="vt-switch-icon"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-switch-appearance-sun"><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-switch-appearance-moon"><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg></span></span></button></div><div class="vt-social-links VPNavBarSocialLinks social-links" data-v-3eb3e878 data-v-02101119><a class="vt-social-link is-small" href="https://github.com/vuejs/" title="github" target="_blank" rel="noopener noreferrer"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-social-link-icon"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg><span class="visually-hidden">github</span></a><a class="vt-social-link is-small" href="https://twitter.com/vuejs" title="twitter" target="_blank" rel="noopener noreferrer"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-social-link-icon"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"></path></svg><span class="visually-hidden">twitter</span></a><a class="vt-social-link is-small" href="https://discord.com/invite/vue" title="discord" target="_blank" rel="noopener noreferrer"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-social-link-icon"><path d="M20.222 0c1.406 0 2.54 1.137 2.607 2.475V24l-2.677-2.273-1.47-1.338-1.604-1.398.67 2.205H3.71c-1.402 0-2.54-1.065-2.54-2.476V2.48C1.17 1.142 2.31.003 3.715.003h16.5L20.222 0zm-6.118 5.683h-.03l-.202.2c2.073.6 3.076 1.537 3.076 1.537-1.336-.668-2.54-1.002-3.744-1.137-.87-.135-1.74-.064-2.475 0h-.2c-.47 0-1.47.2-2.81.735-.467.203-.735.336-.735.336s1.002-1.002 3.21-1.537l-.135-.135s-1.672-.064-3.477 1.27c0 0-1.805 3.144-1.805 7.02 0 0 1 1.74 3.743 1.806 0 0 .4-.533.805-1.002-1.54-.468-2.14-1.404-2.14-1.404s.134.066.335.2h.06c.03 0 .044.015.06.03v.006c.016.016.03.03.06.03.33.136.66.27.93.4.466.202 1.065.403 1.8.536.93.135 1.996.2 3.21 0 .6-.135 1.2-.267 1.8-.535.39-.2.87-.4 1.397-.737 0 0-.6.936-2.205 1.404.33.466.795 1 .795 1 2.744-.06 3.81-1.8 3.87-1.726 0-3.87-1.815-7.02-1.815-7.02-1.635-1.214-3.165-1.26-3.435-1.26l.056-.02zm.168 4.413c.703 0 1.27.6 1.27 1.335 0 .74-.57 1.34-1.27 1.34-.7 0-1.27-.6-1.27-1.334.002-.74.573-1.338 1.27-1.338zm-4.543 0c.7 0 1.266.6 1.266 1.335 0 .74-.57 1.34-1.27 1.34-.7 0-1.27-.6-1.27-1.334 0-.74.57-1.338 1.27-1.338z"></path></svg><span class="visually-hidden">discord</span></a></div><div class="vt-flyout VPNavBarExtra extra" data-v-3eb3e878 data-v-ca4fb57b><button type="button" class="vt-flyout-button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-flyout-button-icon"><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="vt-flyout-menu"><div class="vt-menu"><div class="vt-menu-group" data-v-ca4fb57b><div class="vt-menu-item item" data-v-ca4fb57b><p class="vt-menu-label" data-v-ca4fb57b>外観</p><div class="vt-menu-action action" data-v-ca4fb57b><button class="vt-switch vt-switch-appearance" type="button" role="switch" aria-label="ダークモードの切り替え" aria-checked="false" data-v-ca4fb57b><span class="vt-switch-check"><span class="vt-switch-icon"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-switch-appearance-sun"><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-switch-appearance-moon"><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg></span></span></button></div></div></div><div class="vt-menu-group" data-v-ca4fb57b><div class="vt-menu-item item" data-v-ca4fb57b><div class="vt-social-links social-links" data-v-ca4fb57b><a class="vt-social-link is-small" href="https://github.com/vuejs/" title="github" target="_blank" rel="noopener noreferrer"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-social-link-icon"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg><span class="visually-hidden">github</span></a><a class="vt-social-link is-small" href="https://twitter.com/vuejs" title="twitter" target="_blank" rel="noopener noreferrer"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-social-link-icon"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"></path></svg><span class="visually-hidden">twitter</span></a><a class="vt-social-link is-small" href="https://discord.com/invite/vue" title="discord" target="_blank" rel="noopener noreferrer"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="vt-social-link-icon"><path d="M20.222 0c1.406 0 2.54 1.137 2.607 2.475V24l-2.677-2.273-1.47-1.338-1.604-1.398.67 2.205H3.71c-1.402 0-2.54-1.065-2.54-2.476V2.48C1.17 1.142 2.31.003 3.715.003h16.5L20.222 0zm-6.118 5.683h-.03l-.202.2c2.073.6 3.076 1.537 3.076 1.537-1.336-.668-2.54-1.002-3.744-1.137-.87-.135-1.74-.064-2.475 0h-.2c-.47 0-1.47.2-2.81.735-.467.203-.735.336-.735.336s1.002-1.002 3.21-1.537l-.135-.135s-1.672-.064-3.477 1.27c0 0-1.805 3.144-1.805 7.02 0 0 1 1.74 3.743 1.806 0 0 .4-.533.805-1.002-1.54-.468-2.14-1.404-2.14-1.404s.134.066.335.2h.06c.03 0 .044.015.06.03v.006c.016.016.03.03.06.03.33.136.66.27.93.4.466.202 1.065.403 1.8.536.93.135 1.996.2 3.21 0 .6-.135 1.2-.267 1.8-.535.39-.2.87-.4 1.397-.737 0 0-.6.936-2.205 1.404.33.466.795 1 .795 1 2.744-.06 3.81-1.8 3.87-1.726 0-3.87-1.815-7.02-1.815-7.02-1.635-1.214-3.165-1.26-3.435-1.26l.056-.02zm.168 4.413c.703 0 1.27.6 1.27 1.335 0 .74-.57 1.34-1.27 1.34-.7 0-1.27-.6-1.27-1.334.002-.74.573-1.338 1.27-1.338zm-4.543 0c.7 0 1.266.6 1.266 1.335 0 .74-.57 1.34-1.27 1.34-.7 0-1.27-.6-1.27-1.334 0-.74.57-1.338 1.27-1.338z"></path></svg><span class="visually-hidden">discord</span></a></div></div></div></div></div></div><button type="button" class="vt-hamburger VPNavBarHamburger hamburger" aria-label="モバイル・ナビゲーション" aria-expanded="false" aria-controls="VPNavScreen" data-v-3eb3e878 data-v-55da3568><span class="vt-hamburger-container"><span class="vt-hamburger-top"></span><span class="vt-hamburger-middle"></span><span class="vt-hamburger-bottom"></span></span></button></div></div></div></header><div id="VPContent" class="VPContent" data-v-6a43a5bf data-v-ec00fd1c><div class="VPContentDoc has-aside" data-v-ec00fd1c data-v-d2c3bb8c><div class="container" data-v-d2c3bb8c><div class="aside" data-v-d2c3bb8c><div class="aside-container" data-v-d2c3bb8c><div class="VPContentDocOutline" data-v-d2c3bb8c data-v-c0bf1311><div class="outline-marker" data-v-c0bf1311></div><div class="outline-title" data-v-c0bf1311>目次</div><nav aria-labelledby="doc-outline-aria-label" data-v-c0bf1311><span id="doc-outline-aria-label" class="visually-hidden" data-v-c0bf1311>現在のページの目次</span><ul class="root" data-v-c0bf1311 data-v-1a067250><li data-v-1a067250><a class="outline-link" href="#async-component" style="" data-v-1a067250>非同期コンポーネント（async component）</a></li><li data-v-1a067250><a class="outline-link" href="#compiler-macro" style="" data-v-1a067250>コンパイラーマクロ（compiler macro）</a></li><li data-v-1a067250><a class="outline-link" href="#component" style="" data-v-1a067250>コンポーネント（component）</a></li><li data-v-1a067250><a class="outline-link" href="#composable" style="" data-v-1a067250>コンポーザブル（composable）</a></li><li data-v-1a067250><a class="outline-link" href="#composition-api" style="" data-v-1a067250>Composition API</a></li><li data-v-1a067250><a class="outline-link" href="#custom-element" style="" data-v-1a067250>カスタム要素（custom element）</a></li><li data-v-1a067250><a class="outline-link" href="#directive" style="" data-v-1a067250>ディレクティブ（directive）</a></li><li data-v-1a067250><a class="outline-link" href="#dynamic-component" style="" data-v-1a067250>動的コンポーネント（dynamic component）</a></li><li data-v-1a067250><a class="outline-link" href="#effect" style="" data-v-1a067250>エフェクト/作用（effect）</a></li><li data-v-1a067250><a class="outline-link" href="#event" style="" data-v-1a067250>イベント（event）</a></li><li data-v-1a067250><a class="outline-link" href="#fragment" style="" data-v-1a067250>フラグメント（fragment）</a></li><li data-v-1a067250><a class="outline-link" href="#functional-component" style="" data-v-1a067250>関数型コンポーネント（functional component）</a></li><li data-v-1a067250><a class="outline-link" href="#hoisting" style="" data-v-1a067250>ホイスティング/巻き上げ（hoisting）</a></li><li data-v-1a067250><a class="outline-link" href="#cache-static" style="" data-v-1a067250>静的な部分のキャッシュ</a></li><li data-v-1a067250><a class="outline-link" href="#in-dom-template" style="" data-v-1a067250>DOM 内テンプレート（in-DOM template）</a></li><li data-v-1a067250><a class="outline-link" href="#inject" style="" data-v-1a067250>inject</a></li><li data-v-1a067250><a class="outline-link" href="#lifecycle-hooks" style="" data-v-1a067250>ライフサイクルフック（lifecycle hooks）</a></li><li data-v-1a067250><a class="outline-link" href="#macro" style="" data-v-1a067250>マクロ（macro）</a></li><li data-v-1a067250><a class="outline-link" href="#named-slot" style="" data-v-1a067250>名前付きスロット（named slot）</a></li><li data-v-1a067250><a class="outline-link" href="#options-api" style="" data-v-1a067250>Options API</a></li><li data-v-1a067250><a class="outline-link" href="#plugin" style="" data-v-1a067250>プラグイン（plugin）</a></li><li data-v-1a067250><a class="outline-link" href="#prop" style="" data-v-1a067250>props</a></li><li data-v-1a067250><a class="outline-link" href="#provide-inject" style="" data-v-1a067250>provide / inject</a></li><li data-v-1a067250><a class="outline-link" href="#reactive-effect" style="" data-v-1a067250>リアクティブエフェクト（reactive effect）</a></li><li data-v-1a067250><a class="outline-link" href="#reactivity" style="" data-v-1a067250>リアクティビティー（reactivity）</a></li><li data-v-1a067250><a class="outline-link" href="#reactivity-api" style="" data-v-1a067250>リアクティビティー API（Reactivity API）</a></li><li data-v-1a067250><a class="outline-link" href="#ref" style="" data-v-1a067250>ref</a></li><li data-v-1a067250><a class="outline-link" href="#render-function" style="" data-v-1a067250>レンダー関数（render function）</a></li><li data-v-1a067250><a class="outline-link" href="#scheduler" style="" data-v-1a067250>スケジューラー（scheduler）</a></li><li data-v-1a067250><a class="outline-link" href="#scoped-slot" style="" data-v-1a067250>スコープ付きスロット（scoped slot）</a></li><li data-v-1a067250><a class="outline-link" href="#sfc" style="" data-v-1a067250>SFC</a></li><li data-v-1a067250><a class="outline-link" href="#side-effect" style="" data-v-1a067250>副作用（side effect）</a></li><li data-v-1a067250><a class="outline-link" href="#single-file-component" style="" data-v-1a067250>単一ファイルコンポーネント（Single-File Component）</a></li><li data-v-1a067250><a class="outline-link" href="#slot" style="" data-v-1a067250>スロット（slot）</a></li><li data-v-1a067250><a class="outline-link" href="#template-ref" style="" data-v-1a067250>テンプレート参照（template ref）</a></li><li data-v-1a067250><a class="outline-link" href="#vdom" style="" data-v-1a067250>VDOM</a></li><li data-v-1a067250><a class="outline-link" href="#virtual-dom" style="" data-v-1a067250>仮想 DOM（virtual DOM）</a></li><li data-v-1a067250><a class="outline-link" href="#vnode" style="" data-v-1a067250>VNode</a></li><li data-v-1a067250><a class="outline-link" href="#web-component" style="" data-v-1a067250>Web コンポーネント（Web Component）</a></li></ul></nav></div><div><a class="sponsors-aside-text" href="/sponsor/">スポンサー</a><div class="spsr-container special aside" data-v-4f876f21></div><div class="spsr-container platinum aside" data-v-4f876f21><a href="/sponsor/" class="spsr-item action" data-v-4f876f21>スポンサーになる</a></div></div><div class="VPCarbonAds" data-v-d2c3bb8c></div></div></div><div class="content" data-v-d2c3bb8c><main data-v-d2c3bb8c><div style="position:relative;" class="vt-doc glossary" data-v-d2c3bb8c><div><h1 id="glossary" tabindex="-1">用語集 <a class="header-anchor" href="#glossary" aria-label="Permalink to "用語集 {#glossary}""></a></h1><p>この用語集は、Vue について話すときによく使われる専門用語の意味についてのガイダンスを提供することを目的としています。用語が一般的にどのように使用されているかを説明するものであり、どのように使用しなければならないかを規定するものではありません。一部の用語は、周囲の文脈によって微妙に異なる意味やニュアンスを持つ場合があります。</p><nav class="table-of-contents"><ul><li><a href="#async-component">非同期コンポーネント（async component）</a></li><li><a href="#compiler-macro">コンパイラーマクロ（compiler macro）</a></li><li><a href="#component">コンポーネント（component）</a></li><li><a href="#composable">コンポーザブル（composable）</a></li><li><a href="#composition-api">Composition API</a></li><li><a href="#custom-element">カスタム要素（custom element）</a></li><li><a href="#directive">ディレクティブ（directive）</a></li><li><a href="#dynamic-component">動的コンポーネント（dynamic component）</a></li><li><a href="#effect">エフェクト/作用（effect）</a></li><li><a href="#event">イベント（event）</a></li><li><a href="#fragment">フラグメント（fragment）</a></li><li><a href="#functional-component">関数型コンポーネント（functional component）</a></li><li><a href="#hoisting">ホイスティング/巻き上げ（hoisting）</a></li><li><a href="#cache-static">静的な部分のキャッシュ</a></li><li><a href="#in-dom-template">DOM 内テンプレート（in-DOM template）</a></li><li><a href="#inject">inject</a></li><li><a href="#lifecycle-hooks">ライフサイクルフック（lifecycle hooks）</a></li><li><a href="#macro">マクロ（macro）</a></li><li><a href="#named-slot">名前付きスロット（named slot）</a></li><li><a href="#options-api">Options API</a></li><li><a href="#plugin">プラグイン（plugin）</a></li><li><a href="#prop">props</a></li><li><a href="#provide-inject">provide / inject</a></li><li><a href="#reactive-effect">リアクティブエフェクト（reactive effect）</a></li><li><a href="#reactivity">リアクティビティー（reactivity）</a></li><li><a href="#reactivity-api">リアクティビティー API（Reactivity API）</a></li><li><a href="#ref">ref</a></li><li><a href="#render-function">レンダー関数（render function）</a></li><li><a href="#scheduler">スケジューラー（scheduler）</a></li><li><a href="#scoped-slot">スコープ付きスロット（scoped slot）</a></li><li><a href="#sfc">SFC</a></li><li><a href="#side-effect">副作用（side effect）</a></li><li><a href="#single-file-component">単一ファイルコンポーネント（Single-File Component）</a></li><li><a href="#slot">スロット（slot）</a></li><li><a href="#template-ref">テンプレート参照（template ref）</a></li><li><a href="#vdom">VDOM</a></li><li><a href="#virtual-dom">仮想 DOM（virtual DOM）</a></li><li><a href="#vnode">VNode</a></li><li><a href="#web-component">Web コンポーネント（Web Component）</a></li></ul></nav><h2 id="async-component" tabindex="-1">非同期コンポーネント（async component） <a class="header-anchor" href="#async-component" aria-label="Permalink to "非同期コンポーネント（async component） {#async-component}""></a></h2><p><strong>非同期コンポーネント</strong>は、別のコンポーネントのラッパーで、ラップされたコンポーネントを遅延ロードできるようにします。これは通常、ビルドされた <code>.js</code> ファイルのサイズを小さくする方法として使用され、必要なときだけロードされる小さなチャンクに分割できます。</p><p>Vue Router にも <a href="https://router.vuejs.org/guide/advanced/lazy-loading.html" target="_blank" rel="noreferrer">ルートコンポーネントの遅延読み込み</a> という同様の機能がありますが、こちらは Vue の非同期コンポーネント機能を使用しません。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/guide/components/async.html">ガイド - 非同期コンポーネント</a></li></ul><h2 id="compiler-macro" tabindex="-1">コンパイラーマクロ（compiler macro） <a class="header-anchor" href="#compiler-macro" aria-label="Permalink to "コンパイラーマクロ（compiler macro） {#compiler-macro}""></a></h2><p><strong>コンパイラーマクロ</strong>とは、コンパイラーで処理されて別のものに変換される特別なコードです。これは、文字列置換の巧妙な形式です。</p><p>Vue の <a href="#single-file-component">SFC</a> コンパイラーは、<code>defineProps()</code>, <code>defineEmits()</code>, <code>defineExpose()</code> といった様々なマクロをサポートしています。これらのマクロは、JavaScript / TypeScript と同じパーサーや型推論ツールを利用できるように、意図的に通常の JavaScript 関数のように見えるよう設計されています。しかし、これらはブラウザーで実行される実際の関数ではありません。これらはコンパイラーが検出し、実際に実行される JavaScript コードに置き換える特別な文字列です。</p><p>マクロには、通常の JavaScript のコードには適用されない使用上の制限があります。例えば、<code>const dp = defineProps</code> とすると <code>defineProps</code> のエイリアスを作成できると考えるかもしれませんが、実際にはエラーになります。また、「引数」は実行時ではなく、コンパイラーで処理される必要があるため、<code>defineProps()</code> に渡すことができる値にも制限があります。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/api/sfc-script-setup.html#defineprops-defineemits"><code><script setup></code> - <code>defineProps()</code> & <code>defineEmits()</code></a></li><li><a href="/api/sfc-script-setup.html#defineexpose"><code><script setup></code> - <code>defineExpose()</code></a></li></ul><h2 id="component" tabindex="-1">コンポーネント（component） <a class="header-anchor" href="#component" aria-label="Permalink to "コンポーネント（component） {#component}""></a></h2><p><strong>コンポーネント</strong>という用語は、Vue 特有のものではありません。多くの UI フレームワークに共通するものです。ボタンやチェックボックスのような UI の塊を表現しています。コンポーネントを組み合わせてより大きなコンポーネントを形成することもできます。</p><p>コンポーネントは、保守性の向上とコードの再利用を可能にするため、UI を小さな断片に分割するために Vue が提供する主要なメカニズムです。</p><p>Vue コンポーネントはオブジェクトです。すべてのプロパティは省略可能ですが、コンポーネントをレンダリングするには、テンプレートまたはレンダー関数のいずれかが必要です。例えば、次のようなオブジェクトは有効なコンポーネントとなります:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code" tabindex="0"><code><span class="line"><span style="color:#F97583;">const</span><span style="color:#79B8FF;"> HelloWorldComponent</span><span style="color:#F97583;"> =</span><span style="color:#E1E4E8;"> {</span></span> <span class="line"><span style="color:#B392F0;"> render</span><span style="color:#E1E4E8;">() {</span></span> <span class="line"><span style="color:#F97583;"> return</span><span style="color:#9ECBFF;"> 'Hello world!'</span></span> <span class="line"><span style="color:#E1E4E8;"> }</span></span> <span class="line"><span style="color:#E1E4E8;">}</span></span></code></pre></div><p>実際には、ほとんどの Vue アプリケーションは、<a href="#single-file-component">単一ファイルコンポーネント</a>（<code>.vue</code> ファイル）を使用して作成されます。これらのコンポーネントは一見するとオブジェクトではないように見えますが、SFC コンパイラーによってオブジェクトに変換され、そのファイルのデフォルトエクスポートとして使用されます。外部から見ると、<code>.vue</code> ファイルはコンポーネントオブジェクトをエクスポートする ES モジュールに過ぎません。</p><p>コンポーネントオブジェクトのプロパティは、通常、<strong>オプション</strong>と呼ばれます。これが <a href="#options-api">Options API</a> の名前の由来です。</p><p>コンポーネントのオプションは、そのコンポーネントのインスタンスがどのように作成されるかを定義します。コンポーネントは概念的にはクラスに似ていますが、Vue では実際の JavaScript のクラスを使って定義しているわけではありません。</p><p>また、コンポーネントという用語は、より広義にコンポーネントのインスタンスを指すために使用されることもあります。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/guide/essentials/component-basics.html">ガイド - コンポーネントの基礎</a></li></ul><p>また、「コンポーネント」という言葉は、他にもいくつかの用語で使用されます:</p><ul><li><a href="#async-component">非同期コンポーネント</a></li><li><a href="#dynamic-component">動的コンポーネント</a></li><li><a href="#functional-component">関数型コンポーネント</a></li><li><a href="#web-component">Web コンポーネント</a></li></ul><h2 id="composable" tabindex="-1">コンポーザブル（composable） <a class="header-anchor" href="#composable" aria-label="Permalink to "コンポーザブル（composable） {#composable}""></a></h2><p><strong>コンポーザブル</strong>という用語は、Vue の一般的な使用パターンを説明するものです。これは Vue の独立した機能ではなく、フレームワークの <a href="#composition-api">Composition API</a> を使用する方法にすぎません。</p><ul><li>コンポーザブルは関数です。</li><li>コンポーザブルはステートフルなロジックをカプセル化し再利用するために使用されます。</li><li>関数名は通常 <code>use</code> で始まり、他の開発者にそれがコンポーザブルであることを認識できるようにします。</li><li>この関数は一般的に、コンポーネントの <code>setup()</code> 関数の同期実行中（あるいは <code><script setup></code> ブロックの実行中）に呼び出されることを想定しています。これは、例えば <code>provide()</code>, <code>inject()</code>, <code>onMounted()</code> の呼び出しによって、コンポーザブルの呼び出しを現在のコンポーネントコンテキストに関連付けます。</li><li>コンポーザブルは通常、リアクティブオブジェクトではなく、プレーンオブジェクトを返します。このオブジェクトは通常、ref や関数を含んでおり、呼び出し元のコード内で分割代入されることを想定しています。</li></ul><p>多くのパターンと同様に、特定のコードがこのラベルに該当するかどうかについては、意見が分かれることがあります。JavaScript のユーティリティー関数がすべてコンポーザブルであるわけではありません。もし関数が Composition API を使用していないのであれば、それはおそらくコンポーザブルではありません。もしその関数が <code>setup()</code> の同期実行中に呼び出されることを想定していないのであれば、それはおそらくコンポーザブルではありません。コンポーザブルはステートフルなロジックをカプセル化するために特別に使われるもので、単なる関数の命名規則ではありません。</p><p>コンポーザブルの作成の詳細については、<a href="/guide/reusability/composables.html">ガイド - コンポーザブル</a>を参照してください。</p><h2 id="composition-api" tabindex="-1">Composition API <a class="header-anchor" href="#composition-api" aria-label="Permalink to "Composition API {#composition-api}""></a></h2><p><strong>Composition API</strong>は、Vue でコンポーネントやコンポーザブルを記述するために使用される関数のコレクションです。</p><p>この用語は、コンポーネントを記述するために使用される 2 つの主要なスタイルのうちの 1 つを表すためにも使用され、もう 1 つは <a href="#options-api">Options API</a> です。Composition API を使って書かれたコンポーネントは、<code><script setup></code> または明示的な <code>setup()</code> 関数を使用します。</p><p>詳細については、<a href="/guide/extras/composition-api-faq.html">Composition API に関するよくある質問</a>を参照してください。</p><h2 id="custom-element" tabindex="-1">カスタム要素（custom element） <a class="header-anchor" href="#custom-element" aria-label="Permalink to "カスタム要素（custom element） {#custom-element}""></a></h2><p><strong>カスタム要素</strong>とは、最近のウェブブラウザーに実装されている <a href="#web-component">Web コンポーネント</a> 規格の機能の 1 つです。HTML マークアップでカスタム HTML 要素を使用し、ページ内のその位置に Web コンポーネントを含める機能のことを指します。</p><p>Vue にはカスタム要素をレンダリングするためのサポートが組み込まれており、Vue コンポーネントのテンプレートで直接使用できます。</p><p>カスタム要素を、Vue コンポーネントを他の Vue コンポーネントのテンプレート内のタグとして含める機能と混同しないでください。カスタム要素は、Vue コンポーネントではなく、Web コンポーネントを作成するために使用されます。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/guide/extras/web-components.html">ガイド - Web コンポーネント</a></li></ul><h2 id="directive" tabindex="-1">ディレクティブ（directive） <a class="header-anchor" href="#directive" aria-label="Permalink to "ディレクティブ（directive） {#directive}""></a></h2><p><strong>ディレクティブ</strong>という用語は、接頭辞 <code>v-</code> で始まるテンプレート属性、または同等のショートハンドを指します。</p><p>ビルトインのディレクティブには、 <code>v-if</code>, <code>v-for</code>, <code>v-bind</code>, <code>v-on</code>, <code>v-slot</code> があります。</p><p>Vue はカスタムディレクティブの作成もサポートしていますが、一般的にカスタムディレクティブは DOM ノードを直接操作するための「緊急避難口」としてのみ使用されます。ビルトインのディレクティブの機能は通常、カスタムディレクティブを使って再現できません。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/guide/essentials/template-syntax.html#directives">ガイド - テンプレート構文 - ディレクティブ</a></li><li><a href="/guide/reusability/custom-directives.html">ガイド - カスタムディレクティブ</a></li></ul><h2 id="dynamic-component" tabindex="-1">動的コンポーネント（dynamic component） <a class="header-anchor" href="#dynamic-component" aria-label="Permalink to "動的コンポーネント（dynamic component） {#dynamic-component}""></a></h2><p><strong>動的コンポーネント</strong>という用語は、どの子コンポーネントをレンダリングするかを動的に選択する必要がある場合を説明するために使用されます。通常、これは <code><component :is="type"></code> を用いて実現されます。</p><p>動的コンポーネントは、特別なタイプのコンポーネントではありません。どのようなコンポーネントでも動的コンポーネントとして使用できます。動的なのはコンポーネントの選択であり、コンポーネントそのものではありません。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/guide/essentials/component-basics.html#dynamic-components">ガイド - コンポーネントの基礎 - 動的コンポーネント</a></li></ul><h2 id="effect" tabindex="-1">エフェクト/作用（effect） <a class="header-anchor" href="#effect" aria-label="Permalink to "エフェクト/作用（effect） {#effect}""></a></h2><p><a href="#reactive-effect">リアクティブエフェクト</a>と<a href="#side-effect">副作用</a>を参照してください。</p><h2 id="event" tabindex="-1">イベント（event） <a class="header-anchor" href="#event" aria-label="Permalink to "イベント（event） {#event}""></a></h2><p>プログラムの異なる部分間の通信にイベントを使用することは、プログラミングのさまざまな分野で一般的です。Vue では、この用語はネイティブ HTML 要素のイベントと Vue コンポーネントのイベントの両方に共通で適用されます。テンプレートでは <code>v-on</code> ディレクティブを使用して、両方の種類のイベントを購読できます。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/guide/essentials/event-handling.html">ガイド - イベントハンドリング</a></li><li><a href="/guide/components/events.html">ガイド - コンポーネントのイベント</a></li></ul><h2 id="fragment" tabindex="-1">フラグメント（fragment） <a class="header-anchor" href="#fragment" aria-label="Permalink to "フラグメント（fragment） {#fragment}""></a></h2><p><strong>フラグメント</strong>という用語は、他の <a href="#vnode">VNode</a> の親として使用されますが、それ自身は要素をレンダリングしない特別なタイプの VNode を指します。</p><p>この名前は、ネイティブ DOM API における <a href="https://developer.mozilla.org/ja/docs/Web/API/DocumentFragment" target="_blank" rel="noreferrer"><code>DocumentFragment</code></a> と同様の概念に由来しています。</p><p>フラグメントは、複数のルートノードを持つコンポーネントをサポートするために使用されます。このようなコンポーネントは複数のルートを持っているように見えますが、裏ではフラグメントノードを 1 つのルートとして使用し、「ルート」ノードの親として使用します。</p><p>フラグメントは、テンプレートコンパイラーが複数のダイナミックノード（例えば <code>v-for</code> や <code>v-if</code> で作成されたノード）をラップする方法としても使用されます。これにより、<a href="#virtual-dom">VDOM</a> のパッチアルゴリズムに追加のヒントを渡すことができます。この多くは内部で処理されますが、直接的に遭遇する可能性があるのは、 <code>v-for</code> で <code><template></code> タグに <code>key</code> を使用する場合です。このシナリオでは、<code>key</code> はフラグメントの VNode に <a href="#prop">props</a> として追加されます。</p><p>フラグメントノードは現在、空のテキストノードとして DOM にレンダリングされますが、これは実装の詳細です。<code>$el</code> を使用したり、組み込みのブラウザー API で DOM を走査しようとすると、これらのテキストノードに遭遇することがあります。</p><h2 id="functional-component" tabindex="-1">関数型コンポーネント（functional component） <a class="header-anchor" href="#functional-component" aria-label="Permalink to "関数型コンポーネント（functional component） {#functional-component}""></a></h2><p>コンポーネント定義は通常、オプションを含むオブジェクトです。<code><script setup></code> を使用している場合はそのように見えないかもしれませんが、<code>.vue</code> ファイルからエクスポートされるコンポーネントはオブジェクトであることに変わりはありません。</p><p><strong>関数型コンポーネント</strong>は、代わりに関数を使用して宣言されるコンポーネントの代替形式です。この関数は、コンポーネントの<a href="#render-function">レンダー関数</a>として機能します。</p><p>関数型コンポーネントは、それ自身の状態を持つことはできません。また、通常のコンポーネントのライフサイクルを経ないため、ライフサイクルフックを使用することもできません。このため、通常のステートフルなコンポーネントよりも若干軽量になります。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/guide/extras/render-function.html#functional-components">ガイド - レンダー関数と JSX - 関数型コンポーネント</a></li></ul><h2 id="hoisting" tabindex="-1">ホイスティング/巻き上げ（hoisting） <a class="header-anchor" href="#hoisting" aria-label="Permalink to "ホイスティング/巻き上げ（hoisting） {#hoisting}""></a></h2><p><strong>ホイスティング/巻き上げ</strong>という用語は、コードのセクションに到達する前に、他のコードよりも先に実行することを表すために使用されます。実行は早い時点に「引き上げ」られるのです。</p><p>JavaScript は、<code>var</code>、<code>import</code>、関数宣言など、いくつかの構成要素でホイスティングを使用します。</p><p>Vue のコンテキストでは、コンパイラーはパフォーマンスを向上させるために「ホスティング」を適用します。コンポーネントをコンパイルすると、静的な値はコンポーネントのスコープ外に移動されます。これらの静的な値は、コンポーネントの外部で作成されるため、「hoisted（巻き上げ）」と呼ばれます。</p><h2 id="cache-static" tabindex="-1">静的な部分のキャッシュ <a class="header-anchor" href="#cache-static" aria-label="Permalink to "静的な部分のキャッシュ {#cache-static}""></a></h2><p>「キャッシュ」という用語は、パフォーマンスを向上させるために頻繁にアクセスされるデータを一時的に保存することを表すために使用されます。</p><p>Vue テンプレートコンパイラーは、これらの静的 VNode を識別し、最初のレンダリング中にキャッシュし、その後の再レンダリングごとに同じ VNode を再利用します。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/guide/extras/rendering-mechanism.html#cache-static">ガイド - レンダリングの仕組み - 静的な部分のキャッシュ</a></li></ul><h2 id="in-dom-template" tabindex="-1">DOM 内テンプレート（in-DOM template） <a class="header-anchor" href="#in-dom-template" aria-label="Permalink to "DOM 内テンプレート（in-DOM template） {#in-dom-template}""></a></h2><p>コンポーネントのテンプレートを指定するには、さまざまな方法があります。ほとんどの場合、テンプレートは文字列として提供されます。</p><p><strong>DOM 内テンプレート</strong>という用語は、テンプレートが文字列ではなく、DOM ノードの形式で提供されるシナリオを指します。Vue は、<code>innerHTML</code> を用いて DOM ノードをテンプレート文字列に変換します。</p><p>一般的に、DOM 内テンプレートは、ページの HTML に直接書かれた HTML マークアップとして始まります。ブラウザーはこれを DOM ノードに解析し、Vue はこれを用いて <code>innerHTML</code> を読み取ります。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/guide/essentials/application.html#in-dom-root-component-template">ガイド - Vue アプリケーションの作成 - DOM 内のルートコンポーネントテンプレート</a></li><li><a href="/guide/essentials/component-basics.html#in-dom-template-parsing-caveats">ガイド - コンポーネントの基礎 - DOM 内テンプレート解析の注意点</a></li><li><a href="/api/options-rendering.html#template">オプション: レンダリング - template</a></li></ul><h2 id="inject" tabindex="-1">inject <a class="header-anchor" href="#inject" aria-label="Permalink to "inject {#inject}""></a></h2><p><a href="#provide-inject">provide / inject</a> を参照してください。</p><h2 id="lifecycle-hooks" tabindex="-1">ライフサイクルフック（lifecycle hooks） <a class="header-anchor" href="#lifecycle-hooks" aria-label="Permalink to "ライフサイクルフック（lifecycle hooks） {#lifecycle-hooks}""></a></h2><p>Vue コンポーネントのインスタンスにはライフサイクルがあります。例えば、作成、マウント、更新、アンマウントなどです。</p><p><strong>ライフサイクルフック</strong>は、これらのライフサイクルイベントを購読するための方法です。</p><p>Options API では、各フックは <code>mounted</code> のような個別のオプションとして提供されます。Composition API では、代わりに <code>onMounted()</code> のような関数が使用されます。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/guide/essentials/lifecycle.html">ガイド - ライフサイクルフック</a></li></ul><h2 id="macro" tabindex="-1">マクロ（macro） <a class="header-anchor" href="#macro" aria-label="Permalink to "マクロ（macro） {#macro}""></a></h2><p><a href="#compiler-macro">コンパイラーマクロ</a>を参照してください。</p><h2 id="named-slot" tabindex="-1">名前付きスロット（named slot） <a class="header-anchor" href="#named-slot" aria-label="Permalink to "名前付きスロット（named slot） {#named-slot}""></a></h2><p>コンポーネントは、名前によって区別された複数のスロットを持つことができます。デフォルトのスロット以外のスロットは、<strong>名前付きスロット</strong>と呼ばれます。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/guide/components/slots.html#named-slots">ガイド - スロット - 名前付きスロット</a></li></ul><h2 id="options-api" tabindex="-1">Options API <a class="header-anchor" href="#options-api" aria-label="Permalink to "Options API {#options-api}""></a></h2><p>Vue コンポーネントは、オブジェクトを使って定義されます。このコンポーネントオブジェクトのプロパティは、<strong>オプション</strong>と呼ばれます。</p><p>コンポーネントは 2 つのスタイルで記述できます。1 つは <a href="#composition-api">Composition API</a> と <code>setup</code>（<code>setup()</code> オプションまたは <code><script setup></code>）を組み合わせて使用するスタイルです。もう 1 つのスタイルは、Composition API をほとんど直接使用せず、代わりにさまざまなコンポーネントオプションを使用して同様の結果を実現します。この方法で使用されるコンポーネントオプションは、<strong>Options API</strong> と呼ばれます。</p><p>Options API には、<code>data()</code>、<code>computed</code>、<code>methods</code>、<code>created()</code> といったオプションが含まれます。</p><p>また、<code>props</code>、<code>emits</code>、<code>inheritAttrs</code> などのオプションは、どちらの API でもコンポーネントを作成するときに使用できます。これらはコンポーネントのオプションであるため、Options API の一部とみなすことができます。しかし、これらのオプションは <code>setup()</code> と共に使用されるため、通常は 2 つのコンポーネントスタイル間で共有されると考えた方が便利です。</p><p><code>setup()</code> 関数自体はコンポーネントオプションなので、Options API の一部としてみなすこともできます。しかし、これは「Options API」という用語が通常使用される方法とは異なります。代わりに、<code>setup()</code> 関数は Composition API の一部であると考えられています。</p><h2 id="plugin" tabindex="-1">プラグイン（plugin） <a class="header-anchor" href="#plugin" aria-label="Permalink to "プラグイン（plugin） {#plugin}""></a></h2><p><strong>プラグイン</strong>という言葉は様々な文脈で使われますが、Vue ではアプリケーションに機能を追加する方法として、プラグインという特定の概念があります。</p><p>プラグインは、<code>app.use(plugin)</code> を呼び出すことでアプリケーションに追加されます。プラグイン自体は関数もしくは、<code>install</code> 関数を備えたオブジェクトです。この関数はアプリケーションのインスタンスを渡され、必要なことを何でも行うことができます。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/guide/reusability/plugins.html">ガイド - プラグイン</a></li></ul><h2 id="prop" tabindex="-1">props <a class="header-anchor" href="#prop" aria-label="Permalink to "props {#prop}""></a></h2><p>Vue では、<strong>props</strong> という用語の一般的な使い方が 3 つあります:</p><ul><li>コンポーネントの props</li><li>VNode の props</li><li>スロットの props</li></ul><p><strong>コンポーネントの props</strong> は、ほとんどの人が props として考えているものです。これらは、コンポーネントが <code>defineProps()</code> または <code>props</code> オプションを使用して明示的に定義します。</p><p><strong>VNode の props</strong> という用語は、<code>h()</code> の第 2 引数として渡されたオブジェクトのプロパティを指します。これにはコンポーネント props が含まれますが、コンポーネントイベント、DOM イベント、DOM 属性、DOM プロパティも含まれます。通常、VNode の props に出会うのは、レンダー関数を使って VNode を直接操作する場合だけでしょう。</p><p><strong>スロットの props</strong> は、スコープ付きスロットに渡されるプロパティのことです。</p><p>すべての場合において、props は他の場所から渡されるプロパティです。</p><p>props の語源は <strong>properties</strong>（プロパティ）ですが、Vue の文脈では props という用語はより具体的な意味を持っています。プロパティの略語として使用することは避けてください。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/guide/components/props.html">ガイド - props</a></li><li><a href="/guide/extras/render-function.html">ガイド - レンダー関数と JSX</a></li><li><a href="/guide/components/slots.html#scoped-slots">ガイド - スロット - スコープ付きスロット</a></li></ul><h2 id="provide-inject" tabindex="-1">provide / inject <a class="header-anchor" href="#provide-inject" aria-label="Permalink to "provide / inject {#provide-inject}""></a></h2><p><code>provide</code> と <code>inject</code> はコンポーネント間通信の一形態です。</p><p>あるコンポーネントが値を <strong>provide</strong> したとき、そのコンポーネントのすべての子孫は <code>inject</code> を使ってその値を取得できます。props とは異なり、提供するコンポーネントはどのコンポーネントが値を受け取るかを正確に知ることはできません。</p><p><code>provide</code> と <code>inject</code> は、<strong>props のバケツリレー</strong>を避けるために使用されることがあります。また、コンポーネントがそのスロットの内容と通信するための暗黙の方法として使用することもできます。</p><p>また、<code>provide</code> はアプリケーションレベルでも使用でき、アプリケーション内のすべてのコンポーネントが値を利用できるようになります。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/guide/components/provide-inject.html">ガイド - provide / inject</a></li></ul><h2 id="reactive-effect" tabindex="-1">リアクティブエフェクト（reactive effect） <a class="header-anchor" href="#reactive-effect" aria-label="Permalink to "リアクティブエフェクト（reactive effect） {#reactive-effect}""></a></h2><p><strong>リアクティブエフェクト</strong>は、Vue のリアクティビティーシステムの一部です。これは、関数の依存関係を追跡し、その依存関係の値が変化したときにその関数を再実行するプロセスのことを指します。</p><p><code>watchEffect()</code> は、エフェクトを作成するための最も直接的な方法です。Vue の他の様々な部分が内部的にエフェクトを使用しています。例えば、コンポーネントのレンダリング更新、<code>computed()</code>、<code>watch()</code> などです。</p><p>Vue は、リアクティブエフェクトの中でしかリアクティブな依存関係を追跡できません。もしプロパティの値がリアクティブエフェクトの外で読み込まれた場合、その後そのプロパティが変更された場合に Vue が何をすべきか分からなくなるという意味で、リアクティビティーを「失う」ことになります。</p><p>この用語は、「副作用（side effect）」に由来しています。プロパティの値が変更された副作用として、エフェクト関数が呼び出されます。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/guide/extras/reactivity-in-depth.html">ガイド - リアクティビティーの探求</a></li></ul><h2 id="reactivity" tabindex="-1">リアクティビティー（reactivity） <a class="header-anchor" href="#reactivity" aria-label="Permalink to "リアクティビティー（reactivity） {#reactivity}""></a></h2><p>一般に、<strong>リアクティビティー</strong>とは、データの変化に応じて自動的にアクションを実行する機能のことを指します。例えば、データの値が変化したときに DOM を更新したり、ネットワークリクエストを行ったりすることです。</p><p>Vue の文脈的には、リアクティビティは機能のコレクションを説明するために使用されます。これらの機能を組み合わせて<strong>リアクティビティーシステム</strong>を形成し、<a href="#reactivity-api">リアクティビティー API</a> を介して公開されます。</p><p>リアクティビティーシステムを実装する方法にはさまざまなものがあります。例えば、コードを静的に解析して依存関係を特定する方法があります。しかし、Vue はそのような形式のリアクティビティーシステムを採用していません。</p><p>その代わりに、Vue のリアクティビティーシステムは、実行時にプロパティへのアクセスを追跡します。これは、Proxy ラッパーとプロパティの <a href="https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Functions/get#%E8%A7%A3%E8%AA%AC" target="_blank" rel="noreferrer">getter</a>/<a href="https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Functions/set#%E8%A7%A3%E8%AA%AC" target="_blank" rel="noreferrer">setter</a> 関数の両方を使用して行われます。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/guide/essentials/reactivity-fundamentals.html">ガイド - リアクティビティーの基礎</a></li><li><a href="/guide/extras/reactivity-in-depth.html">ガイド - リアクティビティーの探求</a></li></ul><h2 id="reactivity-api" tabindex="-1">リアクティビティー API（Reactivity API） <a class="header-anchor" href="#reactivity-api" aria-label="Permalink to "リアクティビティー API（Reactivity API） {#reactivity-api}""></a></h2><p><strong>リアクティビティー API</strong>は、<a href="#reactivity">リアクティビティー</a>に関連する Vue のコア関数のコレクションです。これらはコンポーネントから独立して使用できます。<code>ref()</code>、<code>reactive()</code>、<code>computed()</code>、<code>watch()</code>、<code>watchEffect()</code> などの関数が含まれます。</p><p>リアクティビティー API は Composition API のサブセットです。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/api/reactivity-core.html">リアクティビティー API: コア</a></li><li><a href="/api/reactivity-utilities.html">リアクティビティー API: ユーティリティー</a></li><li><a href="/api/reactivity-advanced.html">リアクティビティー API: 上級編</a></li></ul><h2 id="ref" tabindex="-1">ref <a class="header-anchor" href="#ref" aria-label="Permalink to "ref {#ref}""></a></h2><blockquote><p>これは、リアクティビティーの <code>ref</code> の使用についての項目です。テンプレートで使用される <code>ref</code> 属性については、代わりに<a href="#template-ref">テンプレート参照（template refs）</a> を参照してください。</p></blockquote><p><code>ref</code> は、Vue のリアクティビティーシステムの一部です。これは、<code>value</code> と呼ばれる単一のリアクティブプロパティを持つオブジェクトです。</p><p>ref には様々な種類があります。例えば、<code>ref()</code>、<code>shallowRef()</code>、<code>computed()</code>、<code>customRef()</code> を使って ref を作成できます。<code>isRef()</code> 関数はオブジェクトが ref であるかどうかを調べることができ、 <code>isReadonly()</code> は ref がその値の直接の再代入を許すかどうかを調べることができます。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/guide/essentials/reactivity-fundamentals.html">ガイド - リアクティビティーの基礎</a></li><li><a href="/api/reactivity-core.html">リアクティビティー API: コア</a></li><li><a href="/api/reactivity-utilities.html">リアクティビティー API: ユーティリティー</a></li><li><a href="/api/reactivity-advanced.html">リアクティビティー API: 上級編</a></li></ul><h2 id="render-function" tabindex="-1">レンダー関数（render function） <a class="header-anchor" href="#render-function" aria-label="Permalink to "レンダー関数（render function） {#render-function}""></a></h2><p><strong>レンダー関数</strong>はコンポーネントの一部で、レンダリング時に使用する VNode を生成します。テンプレートはレンダー関数にコンパイルされます。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/guide/extras/render-function.html">ガイド - レンダー関数と JSX</a></li></ul><h2 id="scheduler" tabindex="-1">スケジューラー（scheduler） <a class="header-anchor" href="#scheduler" aria-label="Permalink to "スケジューラー（scheduler） {#scheduler}""></a></h2><p><strong>スケジューラー</strong>は、<a href="#reactive-effect">リアクティブエフェクト</a>が実行されるタイミングを制御する Vue の内部構造の一部です。</p><p>リアクティブな状態が変化しても、Vue はすぐにレンダリングの更新をトリガーしません。その代わりに、キューを使用してそれらをまとめてバッチ処理します。これにより、基礎となるデータに複数の変更が加えられた場合でも、コンポーネントの再レンダリングは一度だけであることが保証されます。</p><p><a href="/guide/essentials/watchers.html">ウォッチャー</a>もスケジューラーキューを使用してバッチ処理されます。<code>flush: 'pre'</code>（デフォルト）のウォッチャーはコンポーネントレンダリングの前に実行され、<code>flush: 'post'</code> のウォッチャーはコンポーネントレンダリングの後に実行されます。</p><p>スケジューラー内のジョブは、いくつかの<a href="#lifecycle-hooks">ライフサイクルフック</a>のトリガーや<a href="#template-ref">テンプレート参照</a>の更新など、他の様々な内部タスクの実行にも使用されます。</p><h2 id="scoped-slot" tabindex="-1">スコープ付きスロット（scoped slot） <a class="header-anchor" href="#scoped-slot" aria-label="Permalink to "スコープ付きスロット（scoped slot） {#scoped-slot}""></a></h2><p><strong>スコープ付きスロット</strong>という用語は、<a href="#prop">props</a> を受け取る<a href="#slot">スロット</a>を指すのに使われます。</p><p>歴史的に、Vue はスコープ付きスロットとスコープなしスロットを大きく区別してきました。ある程度は、共通のテンプレート構文で統一された、2 つの別々の機能とみなすことができました。</p><p>Vue 3 では、スロット API が簡素化され、すべてのスロットがスコープ付きスロットのように動作するようになりました。しかし、スコープ付きスロットとスコープなしスロットのユースケースはしばしば異なるため、この用語は props を持つスロットを指す方法としてまだ有用です。</p><p>スロットに渡される props は、スロットの内容を定義する親テンプレートの特定の領域内でのみ使用できます。テンプレートのこの領域は、props の変数スコープとして動作するため、「スコープ付きスロット」と呼ばれるようになりました。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/guide/components/slots.html#scoped-slots">ガイド - スロット - スコープ付きスロット</a></li></ul><h2 id="sfc" tabindex="-1">SFC <a class="header-anchor" href="#sfc" aria-label="Permalink to "SFC {#sfc}""></a></h2><p><a href="#single-file-component">単一ファイルコンポーネント</a> を参照してください。</p><h2 id="side-effect" tabindex="-1">副作用（side effect） <a class="header-anchor" href="#side-effect" aria-label="Permalink to "副作用（side effect） {#side-effect}""></a></h2><p><strong>副作用</strong>という用語は、Vue 特有のものではありません。これは、ローカルスコープを超えて何かを行う操作や関数を説明するために使用されます。</p><p>例えば、<code>user.name = null</code> のようなプロパティを設定する場合、<code>user.name</code> の値を変更することが予想されます。もし、Vue のリアクティビティーシステムを起動させるなど、他のことも行うのであれば、これは副作用と表現されるでしょう。これが Vue の<a href="#reactive-effect">リアクティブエフェクト</a>という用語の由来です。</p><p>関数が副作用を持つと表現される場合、単に値を返すだけでなく、関数の外側で観察できる何らかのアクションを実行することを意味します。これは、状態の値を更新したり、ネットワークリクエストをトリガーしたりすることを意味するかもしれません。</p><p>この用語は、レンダリングや算出プロパティを説明するときによく使われます。レンダリングには副作用がないことがベストプラクティスとされています。同様に、算出プロパティの getter 関数には副作用がないことが望ましいです。</p><h2 id="single-file-component" tabindex="-1">単一ファイルコンポーネント（Single-File Component） <a class="header-anchor" href="#single-file-component" aria-label="Permalink to "単一ファイルコンポーネント（Single-File Component） {#single-file-component}""></a></h2><p><strong>単一ファイルコンポーネント</strong>（SFC）という用語は、Vue コンポーネントによく使われる <code>.vue</code> ファイル形式を指します。</p><p>参照:</p><ul><li><a href="/guide/scaling-up/sfc.html">ガイド - 単一ファイルコンポーネント</a></li><li><a href="/api/sfc-spec.html">SFC 構文仕様</a></li></ul><h2 id="slot" tabindex="-1">スロット（slot） <a class="header-anchor" href="#slot" aria-label="Permalink to "スロット（slot） {#slot}""></a></h2><p>スロットは、子コンポーネントにコンテンツを渡すために使用されます。props がデータ値を渡すのに使われるのに対し、スロットは HTML 要素や他の Vue コンポーネントからなるリッチなコンテンツを渡すのに使われます。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/guide/components/slots.html">ガイド - スロット</a></li></ul><h2 id="template-ref" tabindex="-1">テンプレート参照（template ref） <a class="header-anchor" href="#template-ref" aria-label="Permalink to "テンプレート参照（template ref） {#template-ref}""></a></h2><p><strong>テンプレート参照</strong>という用語は、テンプレート内のタグに <code>ref</code> 属性を使用することを指します。コンポーネントがレンダリングされた後、この属性を使用して、テンプレート内のタグに対応する HTML 要素またはコンポーネントインスタンスを、対応するプロパティに入力します。</p><p>Options API を使用している場合、テンプレート参照は <code>$refs</code> オブジェクトのプロパティを通じて公開されます。</p><p>Composition API を使用する場合、テンプレート参照は同じ名前のリアクティブ <a href="#ref">ref</a> に入力されます。</p><p>テンプレート参照（template ref）と、Vue のリアクティビティーシステムのリアクティブ ref を混同しないでください。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/guide/essentials/template-refs.html">ガイド - テンプレート参照</a></li></ul><h2 id="vdom" tabindex="-1">VDOM <a class="header-anchor" href="#vdom" aria-label="Permalink to "VDOM {#vdom}""></a></h2><p><a href="#virtual-dom">仮想 DOM</a> を参照してください。</p><h2 id="virtual-dom" tabindex="-1">仮想 DOM（virtual DOM） <a class="header-anchor" href="#virtual-dom" aria-label="Permalink to "仮想 DOM（virtual DOM） {#virtual-dom}""></a></h2><p><strong>仮想 DOM</strong>（VDOM）という用語は、Vue 特有のものではありません。これは、UI の更新を管理するために、いくつかの Web フレームワークで使用されている一般的なアプローチです。</p><p>ブラウザーは、ノードのツリーを使用して、ページの現在の状態を表現します。このツリーと、ツリーとのやりとりに使用される JavaScript API は、<strong>ドキュメントオブジェクトモデル</strong>、または <strong>DOM</strong> と呼ばれます。</p><p>DOM を操作することは、パフォーマンスの大きなボトルネックとなります。仮想 DOM は、それを管理するための 1 つの戦略を提供します。</p><p>Vue コンポーネントは DOM ノードを直接作成するのではなく、どのような DOM ノードが必要かを記述したものを生成します。この記述子は、プレーンな JavaScript オブジェクトで、VNode（仮想 DOM ノード）として知られています。VNode の作成は比較的安価です。</p><p>コンポーネントが再レンダリングするたびに、新しい VNode のツリーと以前の VNode のツリーが比較され、違いがあれば実際の DOM に適用されます。何も変わっていなければ、DOM に触れる必要はありません。</p><p>Vue では、<a href="/guide/extras/rendering-mechanism.html#compiler-informed-virtual-dom">コンパイラー情報に基づく仮想 DOM</a> と呼ばれるハイブリッドアプローチを採用しています。Vue のテンプレートコンパイラーは、テンプレートの静的解析に基づいてパフォーマンスの最適化を適用できます。Vue は、実行時にコンポーネントの新旧 VNode ツリーの完全な比較をするのではなく、コンパイラーが抽出した情報を使用して、実際に変更される可能性のあるツリーの部分だけに比較を減らすことができます。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/guide/extras/rendering-mechanism.html">ガイド - レンダリングの仕組み</a></li><li><a href="/guide/extras/render-function.html">ガイド - レンダー関数と JSX</a></li></ul><h2 id="vnode" tabindex="-1">VNode <a class="header-anchor" href="#vnode" aria-label="Permalink to "VNode {#vnode}""></a></h2><p><strong>VNode</strong> は<strong>仮想 DOM ノード</strong>です。<a href="/api/render-function.html#h"><code>h()</code></a> 関数を使用して作成できます。</p><p>詳細については、<a href="#virtual-dom">仮想 DOM</a> を参照してください</p><h2 id="web-component" tabindex="-1">Web コンポーネント（Web Component） <a class="header-anchor" href="#web-component" aria-label="Permalink to "Web コンポーネント（Web Component） {#web-component}""></a></h2><p><strong>Web コンポーネント</strong>規格は、モダン Web ブラウザーに実装されている機能のコレクションです。</p><p>Vue コンポーネントは Web コンポーネントではありませんが、<code>defineCustomElement()</code> を使用することで、Vue コンポーネントから<a href="#custom-element">カスタム要素</a>を作成できます。また、Vue は Vue コンポーネント内部でのカスタム要素の使用もサポートしています。</p><p>詳しくはこちらをご覧ください:</p><ul><li><a href="/guide/extras/web-components.html">ガイド - Vue と Web コンポーネント</a></li></ul></div></div><p class="edit-link" data-v-d2c3bb8c><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 24 24" stroke="currentColor" class="vt-icon" data-v-d2c3bb8c><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"></path></svg><a class="vt-link link" href="https://github.com/vuejs-translations/docs-ja/edit/main/src/glossary/index.md" target="_blank" rel="noopener noreferrer" data-v-d2c3bb8c>このページを GitHub で編集</a></p></main></div></div></div></div><div class="visually-hidden" aria-live="polite" data-v-6a43a5bf>用語集が読み込まれました</div></div></div> <script>window.__VP_HASH_MAP__=JSON.parse("{\"about_coc.md\":\"CwSCtlAy\",\"about_community-guide.md\":\"BpWm_oN3\",\"about_faq.md\":\"CnMgsDNp\",\"about_privacy.md\":\"C1NORVJA\",\"about_releases.md\":\"CrbBoPaa\",\"about_team.md\":\"CqM8fUQR\",\"about_v2-faq.md\":\"CveQNU-A\",\"api_application.md\":\"nLOzjCGB\",\"api_built-in-components.md\":\"DSE-BIct\",\"api_built-in-directives.md\":\"CLuoPsws\",\"api_built-in-special-attributes.md\":\"DV00LMcx\",\"api_built-in-special-elements.md\":\"ChT3NRZ4\",\"api_compile-time-flags.md\":\"DTKsiIwZ\",\"api_component-instance.md\":\"Q3xTQ03m\",\"api_composition-api-dependency-injection.md\":\"CdOOZBjL\",\"api_composition-api-helpers.md\":\"C2TEFxEX\",\"api_composition-api-lifecycle.md\":\"VOuZ527v\",\"api_composition-api-setup.md\":\"BtF-WFD2\",\"api_custom-elements.md\":\"cNKdZeeB\",\"api_custom-renderer.md\":\"Ou910F-q\",\"api_general.md\":\"D9knxFqN\",\"api_index.md\":\"GWQpdBwn\",\"api_options-composition.md\":\"C3V6M5Fm\",\"api_options-lifecycle.md\":\"Br-N6YqA\",\"api_options-misc.md\":\"ilrTSLDu\",\"api_options-rendering.md\":\"Ktpcm-na\",\"api_options-state.md\":\"XytjSJ3a\",\"api_reactivity-advanced.md\":\"CwlzJcJj\",\"api_reactivity-core.md\":\"0lwdi1as\",\"api_reactivity-utilities.md\":\"40xFN2iK\",\"api_render-function.md\":\"DhM4t8t6\",\"api_sfc-css-features.md\":\"DpBVf-qR\",\"api_sfc-script-setup.md\":\"1APFk67j\",\"api_sfc-spec.md\":\"BHWpv_oD\",\"api_ssr.md\":\"YDKRPHT1\",\"api_utility-types.md\":\"CcOosj1G\",\"developers_abdusaid-html-css-vue-typescript-frontend-dev.md\":\"4xwPfzYT\",\"developers_eduard-miskov-vue-frontend-developer.md\":\"DNKmseSG\",\"developers_emre-vue-frontend-developer.md\":\"DyGmqmOc\",\"developers_harshit-vue-frontend-developer.md\":\"CsdGGjFB\",\"developers_index.md\":\"DvW61Jrc\",\"developers_kostiantyn-vue-frontend-developer.md\":\"j17N0-vq\",\"developers_nicolas-vue-php-fullstack-developer.md\":\"BeNKGG1d\",\"developers_santiago-anaya-vue-ruby-fullstack-developer.md\":\"BYfW8fbn\",\"developers_stelios-vue-node-fullstack-developer.md\":\"CGB09st5\",\"developers_tomek-vue-node-fullstack-developer.md\":\"BAoGtEzD\",\"developers_vardan-vue-node-fullstack-developer.md\":\"C4W7Nwa9\",\"ecosystem_newsletters.md\":\"BgGg3Gfo\",\"ecosystem_themes.md\":\"CplIdVEO\",\"error-reference_index.md\":\"Bdj5q6jR\",\"examples_index.md\":\"DlUp56u3\",\"glossary_index.md\":\"CRau0nne\",\"guide_best-practices_accessibility.md\":\"Tchh0VDv\",\"guide_best-practices_performance.md\":\"DUE78ko6\",\"guide_best-practices_production-deployment.md\":\"C8FKM8Eq\",\"guide_best-practices_security.md\":\"D6r6tRAR\",\"guide_built-ins_keep-alive.md\":\"DyfnfAjy\",\"guide_built-ins_suspense.md\":\"B9Dpb_S9\",\"guide_built-ins_teleport.md\":\"CxqZXds_\",\"guide_built-ins_transition-group.md\":\"Bpd7cVrM\",\"guide_built-ins_transition.md\":\"Dr6Zz_ei\",\"guide_components_async.md\":\"Zl3C-2_R\",\"guide_components_attrs.md\":\"Dw_MVkk1\",\"guide_components_events.md\":\"CWlzJGnb\",\"guide_components_props.md\":\"BLq8HJhh\",\"guide_components_provide-inject.md\":\"Bxl3bejR\",\"guide_components_registration.md\":\"D8GBhmHa\",\"guide_components_slots.md\":\"BqinmN22\",\"guide_components_v-model.md\":\"C6t6zaIO\",\"guide_essentials_application.md\":\"TVipVODf\",\"guide_essentials_class-and-style.md\":\"BcfXeYp7\",\"guide_essentials_component-basics.md\":\"CuunEKvL\",\"guide_essentials_computed.md\":\"D-nfOga_\",\"guide_essentials_conditional.md\":\"BN0t9uv5\",\"guide_essentials_event-handling.md\":\"CJBW6TOF\",\"guide_essentials_forms.md\":\"DkIFRFDi\",\"guide_essentials_lifecycle.md\":\"D-hdKhSr\",\"guide_essentials_list.md\":\"DZYukJYv\",\"guide_essentials_reactivity-fundamentals.md\":\"D3imgo6h\",\"guide_essentials_template-refs.md\":\"BDUYcVNG\",\"guide_essentials_template-syntax.md\":\"BqJwGsrv\",\"guide_essentials_watchers.md\":\"IXYuiXMF\",\"guide_extras_animation.md\":\"CtE1RWzq\",\"guide_extras_composition-api-faq.md\":\"D2KaAKQO\",\"guide_extras_reactivity-in-depth.md\":\"DZUT-EVI\",\"guide_extras_reactivity-transform.md\":\"BxVmjETL\",\"guide_extras_render-function.md\":\"BAzyDAGU\",\"guide_extras_rendering-mechanism.md\":\"D8eSrSmn\",\"guide_extras_ways-of-using-vue.md\":\"DlLijqIR\",\"guide_extras_web-components.md\":\"CvqkTWU6\",\"guide_introduction.md\":\"G3zfJ3hP\",\"guide_quick-start.md\":\"C_PKSAxY\",\"guide_reusability_composables.md\":\"DXmYB2AC\",\"guide_reusability_custom-directives.md\":\"tQlPqUzL\",\"guide_reusability_plugins.md\":\"D24VMG1D\",\"guide_scaling-up_routing.md\":\"BEacKGT3\",\"guide_scaling-up_sfc.md\":\"BK4WTzG0\",\"guide_scaling-up_ssr.md\":\"J24ic66D\",\"guide_scaling-up_state-management.md\":\"CkSajmAx\",\"guide_scaling-up_testing.md\":\"CR7mvpB_\",\"guide_scaling-up_tooling.md\":\"CP2gIYxM\",\"guide_typescript_composition-api.md\":\"BJGXs2JW\",\"guide_typescript_options-api.md\":\"DRzvcPlZ\",\"guide_typescript_overview.md\":\"BPW8G-4-\",\"index.md\":\"BNWO3K6G\",\"partners_all.md\":\"DkVIB5VL\",\"partners_curotec.md\":\"BQIB3333\",\"partners_herodevs.md\":\"D1YWAhwi\",\"partners_index.md\":\"CNH_H1xR\",\"partners_monterail.md\":\"DIF4s4NQ\",\"partners_passionatepeople.md\":\"C3BG3Opk\",\"partners_proxify.md\":\"CbjA_2n3\",\"partners_redberry.md\":\"ChDM_DeW\",\"partners_vehikl.md\":\"jdjBPsZF\",\"partners_webreinvent.md\":\"xkT-Q3SD\",\"sponsor_index.md\":\"C2JZ06JK\",\"style-guide_index.md\":\"CT01D6oo\",\"style-guide_rules-essential.md\":\"DpcJ4RKD\",\"style-guide_rules-recommended.md\":\"CMNinRzt\",\"style-guide_rules-strongly-recommended.md\":\"BZociAlO\",\"style-guide_rules-use-with-caution.md\":\"DZmI9LIQ\",\"translations_index.md\":\"o-pGdSjw\",\"tutorial_index.md\":\"to4LDD9K\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"ja\",\"dir\":\"ltr\",\"title\":\"Vue.js\",\"description\":\"Vue.js - The Progressive JavaScript Framework\",\"base\":\"/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"ドキュメント\",\"activeMatch\":\"^/(guide|style-guide|cookbook|examples)/\",\"items\":[{\"text\":\"ガイド\",\"link\":\"/guide/introduction\"},{\"text\":\"チュートリアル\",\"link\":\"/tutorial/\"},{\"text\":\"実装例\",\"link\":\"/examples/\"},{\"text\":\"クイックスタート\",\"link\":\"/guide/quick-start\"},{\"text\":\"用語集\",\"link\":\"/glossary/\"},{\"text\":\"エラーリファレンス\",\"link\":\"/error-reference/\"},{\"text\":\"Vue 2 のドキュメント\",\"link\":\"https://v2.ja.vuejs.org\"},{\"text\":\"Vue 2 からの移行\",\"link\":\"https://v3-migration.vuejs.org/ja/\"}]},{\"text\":\"API\",\"activeMatch\":\"^/api/\",\"link\":\"/api/\"},{\"text\":\"プレイグラウンド\",\"link\":\"https://play.vuejs.org\"},{\"text\":\"エコシステム\",\"activeMatch\":\"^/ecosystem/\",\"items\":[{\"text\":\"リソース\",\"items\":[{\"text\":\"パートナー\",\"link\":\"/partners/\"},{\"text\":\"デベロッパー\",\"link\":\"/developers/\"},{\"text\":\"テーマ\",\"link\":\"/ecosystem/themes\"},{\"text\":\"UI コンポーネント\",\"link\":\"https://ui-libs.vercel.app/\"},{\"text\":\"検定\",\"link\":\"https://certificates.dev/vuejs/?ref=vuejs-nav\"},{\"text\":\"仕事\",\"link\":\"https://vuejobs.com/?ref=vuejs\"},{\"text\":\"T シャツショップ\",\"link\":\"https://vue.threadless.com/\"}]},{\"text\":\"公式ライブラリー\",\"items\":[{\"text\":\"Vue Router\",\"link\":\"https://router.vuejs.org/\"},{\"text\":\"Pinia\",\"link\":\"https://pinia.vuejs.org/\"},{\"text\":\"ツールガイド\",\"link\":\"/guide/scaling-up/tooling.html\"}]},{\"text\":\"動画講座\",\"items\":[{\"text\":\"Vue Mastery\",\"link\":\"https://www.vuemastery.com/courses/\"},{\"text\":\"Vue School\",\"link\":\"https://vueschool.io/?friend=vuejs&utm_source=Vuejs.org&utm_medium=Link&utm_content=Navbar%20Dropdown\"}]},{\"text\":\"ヘルプ\",\"items\":[{\"text\":\"Discord Chat\",\"link\":\"https://discord.com/invite/HBherRA\"},{\"text\":\"GitHub Discussions\",\"link\":\"https://github.com/vuejs/core/discussions\"},{\"text\":\"DEV Community\",\"link\":\"https://dev.to/t/vue\"}]},{\"text\":\"ニュース\",\"items\":[{\"text\":\"ブログ\",\"link\":\"https://blog.vuejs.org/\"},{\"text\":\"Twitter\",\"link\":\"https://twitter.com/vuejs\"},{\"text\":\"イベント\",\"link\":\"https://events.vuejs.org/\"},{\"text\":\"ニュースレター\",\"link\":\"/ecosystem/newsletters\"}]}]},{\"text\":\"情報\",\"activeMatch\":\"^/about/\",\"items\":[{\"text\":\"FAQ\",\"link\":\"/about/faq\"},{\"text\":\"チーム\",\"link\":\"/about/team\"},{\"text\":\"リリース\",\"link\":\"/about/releases\"},{\"text\":\"コミュニティーガイド\",\"link\":\"/about/community-guide\"},{\"text\":\"行動規範\",\"link\":\"/about/coc\"},{\"text\":\"プライバシーポリシー\",\"link\":\"/about/privacy\"},{\"text\":\"ドキュメンタリー\",\"link\":\"https://www.youtube.com/watch?v=OrxmtDw4pVI\"}]},{\"text\":\"スポンサー\",\"link\":\"/sponsor/\"},{\"text\":\"エキスパート\",\"badge\":{\"text\":\"NEW\"},\"activeMatch\":\"^/(partners|developers)/\",\"items\":[{\"text\":\"パートナー\",\"link\":\"/partners/\"},{\"text\":\"デベロッパー\",\"link\":\"/developers/\",\"badge\":{\"text\":\"NEW\"}}]}],\"sidebar\":{\"/guide/\":[{\"text\":\"入門\",\"items\":[{\"text\":\"はじめに\",\"link\":\"/guide/introduction\"},{\"text\":\"クイックスタート\",\"link\":\"/guide/quick-start\"}]},{\"text\":\"基本\",\"items\":[{\"text\":\"アプリケーションの作成\",\"link\":\"/guide/essentials/application\"},{\"text\":\"テンプレート構文\",\"link\":\"/guide/essentials/template-syntax\"},{\"text\":\"リアクティビティーの基礎\",\"link\":\"/guide/essentials/reactivity-fundamentals\"},{\"text\":\"算出プロパティ\",\"link\":\"/guide/essentials/computed\"},{\"text\":\"クラスとスタイルのバインディング\",\"link\":\"/guide/essentials/class-and-style\"},{\"text\":\"条件付きレンダリング\",\"link\":\"/guide/essentials/conditional\"},{\"text\":\"リストレンダリング\",\"link\":\"/guide/essentials/list\"},{\"text\":\"イベントハンドリング\",\"link\":\"/guide/essentials/event-handling\"},{\"text\":\"フォーム入力バインディング\",\"link\":\"/guide/essentials/forms\"},{\"text\":\"ウォッチャー\",\"link\":\"/guide/essentials/watchers\"},{\"text\":\"テンプレート参照\",\"link\":\"/guide/essentials/template-refs\"},{\"text\":\"コンポーネントの基礎\",\"link\":\"/guide/essentials/component-basics\"},{\"text\":\"ライフサイクルフック\",\"link\":\"/guide/essentials/lifecycle\"}]},{\"text\":\"コンポーネントの詳細\",\"items\":[{\"text\":\"登録\",\"link\":\"/guide/components/registration\"},{\"text\":\"props\",\"link\":\"/guide/components/props\"},{\"text\":\"イベント\",\"link\":\"/guide/components/events\"},{\"text\":\"コンポーネントの v-model\",\"link\":\"/guide/components/v-model\"},{\"text\":\"フォールスルー属性\",\"link\":\"/guide/components/attrs\"},{\"text\":\"スロット\",\"link\":\"/guide/components/slots\"},{\"text\":\"Provide / inject\",\"link\":\"/guide/components/provide-inject\"},{\"text\":\"非同期コンポーネント\",\"link\":\"/guide/components/async\"}]},{\"text\":\"再利用性\",\"items\":[{\"text\":\"コンポーザブル\",\"link\":\"/guide/reusability/composables\"},{\"text\":\"カスタムディレクティブ\",\"link\":\"/guide/reusability/custom-directives\"},{\"text\":\"プラグイン\",\"link\":\"/guide/reusability/plugins\"}]},{\"text\":\"組み込みコンポーネント\",\"items\":[{\"text\":\"トランジション\",\"link\":\"/guide/built-ins/transition\"},{\"text\":\"トランジショングループ\",\"link\":\"/guide/built-ins/transition-group\"},{\"text\":\"KeepAlive\",\"link\":\"/guide/built-ins/keep-alive\"},{\"text\":\"Teleport\",\"link\":\"/guide/built-ins/teleport\"},{\"text\":\"Suspense\",\"link\":\"/guide/built-ins/suspense\"}]},{\"text\":\"スケールアップ\",\"items\":[{\"text\":\"単一ファイルコンポーネント\",\"link\":\"/guide/scaling-up/sfc\"},{\"text\":\"ツール\",\"link\":\"/guide/scaling-up/tooling\"},{\"text\":\"ルーティング\",\"link\":\"/guide/scaling-up/routing\"},{\"text\":\"状態管理\",\"link\":\"/guide/scaling-up/state-management\"},{\"text\":\"テスト\",\"link\":\"/guide/scaling-up/testing\"},{\"text\":\"サーバーサイドレンダリング（SSR）\",\"link\":\"/guide/scaling-up/ssr\"}]},{\"text\":\"ベストプラクティス\",\"items\":[{\"text\":\"本番デプロイ\",\"link\":\"/guide/best-practices/production-deployment\"},{\"text\":\"パフォーマンス\",\"link\":\"/guide/best-practices/performance\"},{\"text\":\"アクセシビリティー\",\"link\":\"/guide/best-practices/accessibility\"},{\"text\":\"セキュリティー\",\"link\":\"/guide/best-practices/security\"}]},{\"text\":\"TypeScript\",\"items\":[{\"text\":\"概要\",\"link\":\"/guide/typescript/overview\"},{\"text\":\"Composition API と TypeScript\",\"link\":\"/guide/typescript/composition-api\"},{\"text\":\"Options API と TypeScript\",\"link\":\"/guide/typescript/options-api\"}]},{\"text\":\"番外トピック\",\"items\":[{\"text\":\"Vue のさまざまな活用方法\",\"link\":\"/guide/extras/ways-of-using-vue\"},{\"text\":\"Composition API の FAQ\",\"link\":\"/guide/extras/composition-api-faq\"},{\"text\":\"リアクティビティーの探求\",\"link\":\"/guide/extras/reactivity-in-depth\"},{\"text\":\"レンダリングの仕組み\",\"link\":\"/guide/extras/rendering-mechanism\"},{\"text\":\"レンダー関数と JSX\",\"link\":\"/guide/extras/render-function\"},{\"text\":\"Vue と Web コンポーネント\",\"link\":\"/guide/extras/web-components\"},{\"text\":\"アニメーションテクニック\",\"link\":\"/guide/extras/animation\"}]}],\"/api/\":[{\"text\":\"グローバル API\",\"items\":[{\"text\":\"アプリケーション\",\"link\":\"/api/application\"},{\"text\":\"汎用\",\"link\":\"/api/general\"}]},{\"text\":\"Composition API\",\"items\":[{\"text\":\"setup()\",\"link\":\"/api/composition-api-setup\"},{\"text\":\"リアクティビティー: コア\",\"link\":\"/api/reactivity-core\"},{\"text\":\"リアクティビティー: ユーティリティー\",\"link\":\"/api/reactivity-utilities\"},{\"text\":\"リアクティビティー: 上級編\",\"link\":\"/api/reactivity-advanced\"},{\"text\":\"ライフサイクルフック\",\"link\":\"/api/composition-api-lifecycle\"},{\"text\":\"依存関係の注入\",\"link\":\"/api/composition-api-dependency-injection\"},{\"text\":\"ヘルパー\",\"link\":\"/api/composition-api-helpers\"}]},{\"text\":\"Options API\",\"items\":[{\"text\":\"オプション: 状態\",\"link\":\"/api/options-state\"},{\"text\":\"オプション: レンダリング\",\"link\":\"/api/options-rendering\"},{\"text\":\"オプション: ライフサイクル\",\"link\":\"/api/options-lifecycle\"},{\"text\":\"オプション: 合成\",\"link\":\"/api/options-composition\"},{\"text\":\"オプション: その他\",\"link\":\"/api/options-misc\"},{\"text\":\"コンポーネントインスタンス\",\"link\":\"/api/component-instance\"}]},{\"text\":\"ビルトイン\",\"items\":[{\"text\":\"ディレクティブ\",\"link\":\"/api/built-in-directives\"},{\"text\":\"コンポーネント\",\"link\":\"/api/built-in-components\"},{\"text\":\"特別な要素\",\"link\":\"/api/built-in-special-elements\"},{\"text\":\"特別な属性\",\"link\":\"/api/built-in-special-attributes\"}]},{\"text\":\"単一ファイルコンポーネント\",\"items\":[{\"text\":\"構文仕様\",\"link\":\"/api/sfc-spec\"},{\"text\":\"<script setup>\",\"link\":\"/api/sfc-script-setup\"},{\"text\":\"CSS 機能\",\"link\":\"/api/sfc-css-features\"}]},{\"text\":\"高度な API\",\"items\":[{\"text\":\"カスタム要素\",\"link\":\"/api/custom-elements\"},{\"text\":\"レンダー関数\",\"link\":\"/api/render-function\"},{\"text\":\"サーバーサイドレンダリング\",\"link\":\"/api/ssr\"},{\"text\":\"TypeScript ユーティリティー\",\"link\":\"/api/utility-types\"},{\"text\":\"カスタムレンダラー\",\"link\":\"/api/custom-renderer\"},{\"text\":\"コンパイル時フラグ\",\"link\":\"/api/compile-time-flags\"}]}],\"/examples/\":[{\"text\":\"Basic\",\"items\":[{\"text\":\"Hello World\",\"link\":\"/examples/#hello-world\"},{\"text\":\"Handling User Input\",\"link\":\"/examples/#handling-input\"},{\"text\":\"Attribute Bindings\",\"link\":\"/examples/#attribute-bindings\"},{\"text\":\"Conditionals and Loops\",\"link\":\"/examples/#conditionals-and-loops\"},{\"text\":\"Form Bindings\",\"link\":\"/examples/#form-bindings\"},{\"text\":\"Simple Component\",\"link\":\"/examples/#simple-component\"}]},{\"text\":\"Practical\",\"items\":[{\"text\":\"Markdown Editor\",\"link\":\"/examples/#markdown\"},{\"text\":\"Fetching Data\",\"link\":\"/examples/#fetching-data\"},{\"text\":\"Grid with Sort and Filter\",\"link\":\"/examples/#grid\"},{\"text\":\"Tree View\",\"link\":\"/examples/#tree\"},{\"text\":\"SVG Graph\",\"link\":\"/examples/#svg\"},{\"text\":\"Modal with Transitions\",\"link\":\"/examples/#modal\"},{\"text\":\"List with Transitions\",\"link\":\"/examples/#list-transition\"},{\"text\":\"TodoMVC\",\"link\":\"/examples/#todomvc\"}]},{\"text\":\"7 GUIs\",\"items\":[{\"text\":\"Counter\",\"link\":\"/examples/#counter\"},{\"text\":\"Temperature Converter\",\"link\":\"/examples/#temperature-converter\"},{\"text\":\"Flight Booker\",\"link\":\"/examples/#flight-booker\"},{\"text\":\"Timer\",\"link\":\"/examples/#timer\"},{\"text\":\"CRUD\",\"link\":\"/examples/#crud\"},{\"text\":\"Circle Drawer\",\"link\":\"/examples/#circle-drawer\"},{\"text\":\"Cells\",\"link\":\"/examples/#cells\"}]}],\"/style-guide/\":[{\"text\":\"Style Guide\",\"items\":[{\"text\":\"概要\",\"link\":\"/style-guide/\"},{\"text\":\"優先度A: 必須\",\"link\":\"/style-guide/rules-essential\"},{\"text\":\"優先度B: 強く推奨\",\"link\":\"/style-guide/rules-strongly-recommended\"},{\"text\":\"優先度C: 推奨\",\"link\":\"/style-guide/rules-recommended\"},{\"text\":\"優先度D: 注意深く使用する\",\"link\":\"/style-guide/rules-use-with-caution\"}]}]},\"i18n\":{\"search\":\"検索\",\"menu\":\"メニュー\",\"toc\":\"目次\",\"returnToTop\":\"上に戻る\",\"appearance\":\"外観\",\"previous\":\"前のページ\",\"next\":\"次のページ\",\"pageNotFound\":\"ページが見つかりません\",\"deadLink\":{\"before\":\"存在しないリンクです: \",\"link\":\"\",\"after\":\"\"},\"deadLinkReport\":{\"before\":\"修正しますので\",\"link\":\"こちらのリンク\",\"after\":\"よりお知らせください。\"},\"footerLicense\":{\"before\":\"\",\"link\":\"\",\"after\":\"のもとで公開されています。\"},\"ariaAnnouncer\":{\"before\":\"\",\"link\":\"\",\"after\":\"が読み込まれました\"},\"ariaDarkMode\":\"ダークモードの切り替え\",\"ariaSkipToContent\":\"本文へジャンプ\",\"ariaToC\":\"現在のページの目次\",\"ariaMainNav\":\"メイン・ナビゲーション\",\"ariaMobileNav\":\"モバイル・ナビゲーション\",\"ariaSidebarNav\":\"サイドバー・ナビゲーション\"},\"localeLinks\":[{\"link\":\"https://vuejs.org\",\"text\":\"English\",\"repo\":\"https://github.com/vuejs/docs\"},{\"link\":\"https://cn.vuejs.org\",\"text\":\"简体中文\",\"repo\":\"https://github.com/vuejs-translations/docs-zh-cn\"},{\"link\":\"https://ua.vuejs.org\",\"text\":\"Українська\",\"repo\":\"https://github.com/vuejs-translations/docs-uk\"},{\"link\":\"https://fr.vuejs.org\",\"text\":\"Français\",\"repo\":\"https://github.com/vuejs-translations/docs-fr\"},{\"link\":\"https://ko.vuejs.org\",\"text\":\"한국어\",\"repo\":\"https://github.com/vuejs-translations/docs-ko\"},{\"link\":\"https://pt.vuejs.org\",\"text\":\"Português\",\"repo\":\"https://github.com/vuejs-translations/docs-pt\"},{\"link\":\"https://bn.vuejs.org\",\"text\":\"বাংলা\",\"repo\":\"https://github.com/vuejs-translations/docs-bn\"},{\"link\":\"https://it.vuejs.org\",\"text\":\"Italiano\",\"repo\":\"https://github.com/vuejs-translations/docs-it\"},{\"link\":\"https://fa.vuejs.org\",\"text\":\"فارسی\",\"repo\":\"https://github.com/vuejs-translations/docs-fa\"},{\"link\":\"https://ru.vuejs.org\",\"text\":\"Русский\",\"repo\":\"https://github.com/translation-gang/docs-ru\"},{\"link\":\"https://cs.vuejs.org\",\"text\":\"Čeština\",\"repo\":\"https://github.com/vuejs-translations/docs-cs\"},{\"link\":\"https://zh-hk.vuejs.org\",\"text\":\"繁體中文\",\"repo\":\"https://github.com/vuejs-translations/docs-zh-hk\"},{\"link\":\"https://pl.vuejs.org\",\"text\":\"Polski\",\"repo\":\"https://github.com/vuejs-translations/docs-pl\"},{\"link\":\"/translations/\",\"text\":\"翻訳にご協力ください！\",\"isTranslationsDesc\":true}],\"algolia\":{\"indexName\":\"vuejs\",\"appId\":\"ML0LEBN7FQ\",\"apiKey\":\"21cf9df0734770a2448a9da64a700c22\",\"searchParameters\":{\"facetFilters\":[\"version:v3\"]}},\"carbonAds\":{\"code\":\"CEBDT27Y\",\"placement\":\"vuejsorg\"},\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/vuejs/\"},{\"icon\":\"twitter\",\"link\":\"https://twitter.com/vuejs\"},{\"icon\":\"discord\",\"link\":\"https://discord.com/invite/vue\"}],\"editLink\":{\"repo\":\"vuejs-translations/docs-ja\",\"text\":\"このページを GitHub で編集\"},\"footer\":{\"license\":{\"text\":\"MIT ライセンス\",\"link\":\"https://opensource.org/licenses/MIT\"},\"copyright\":\"日本語ドキュメントの内容の著作権は Vue 公式チームと翻訳協力者にあり、すべての権利は留保されています。\"}},\"locales\":{},\"scrollOffset\":[\"header\",\".VPLocalNav\"],\"cleanUrls\":false}");</script> </body> </html>