摘要

v-once 是一個效能優化指令，它使一個元素及其所有子元素只被渲染一次。之後，無論資料如何變化，該區塊都將被視為靜態內容，不再更新。

定義與說明

當你確定某部分 UI 在初次渲染後就無需再變動時，可以使用 v-once。這會告訴 Vue 在後續的更新週期中，可以安全地跳過對這個區塊的檢查，從而減輕渲染負擔，提升效能。

實作範例

Vue SFC

<script setup>
import { ref } from 'vue';
const initialId = ref('user-123');
</script>
<template>
  <!-- 這個 ID 只會被設定一次，之後即使 initialId 改變也不會更新 -->
  <h1 v-once>使用者 ID: {{ initialId }}</h1>
</template>

結論

v-once 是針對特定場景的效能優化工具。對於那些渲染後即固定的內容，使用 v-once 是一個簡單有效的優化手段。

v-once 一次性綁定效能優化