v-cloak/index.html
<div id="app">
<h1>{{ message }}</h1>
</div>
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script> <script> const { createApp } = Vue; window.setTimeout(() => { createApp({ data() { return { message: 'Hello Vue!', }; }, }).mount('#app'); }, 2000); </script>
새로고침(F5)해 봅시다. 뷰가 적용되기 전에 콧수염 문법이 잠깐 보였다가 2초 뒤에 뷰 패키지 적용이 끝나면 설정한 데이터로 변경됩니다. 이를 막기 위해 다음과 같이 코드를 수정합니다.