앞의 예제 코드에 다음과 같이 v-once 디렉티브를 붙여줍니다. 코드를 실행하면 [증가] 버튼을 아무리 눌러도 초기 화면에서 숫자가 바뀌지 않습니다. 한 번 렌더링하고 나면 더 이상 렌더링되지 않기 때문입니다.

<template>

  <h1 v-once>{{ number }}</h1>

  <button type="button" @click="increasement">증가</button>
</template>

그림 3-24 v-once 실행결과