• 初回だけテンプレートを評価し、それ以降は静的なコンテンツとして扱いたい
• 初回だけテキストバインディングを行い

Ex

• API呼び出しなどを画面がロードされた時に行いたいが、それ以降結果は変わらないので最初の一回だけでいい等の状況
• ページ更新のパフォーマンス向上

<p v-once>{{ message }}</p>

• 初期レンダリングの「Hello World」をメソッドで変更した後も変更させたくない場合

<div id="app">
  <p v-once>{{ message }}</p>
  <p>{{ sayHi() }}</p>
</div>

new Vue({
    el: "#app",
    data: {
        message: 'Hello World'
    },
    methods: {
        sayHi() {
            this.message = 'Hello VueJS'
            return 'hi';
        },
    },
});

Hello World
🔼v-onceで一度だけしかレンダリングされないため、sayHi関数で値が変わらない

hi