एक computed property एक reactive value होती है जो अन्य reactive state से व्युत्पन्न (derived) होती है। जब इसकी dependencies बदलती हैं तो यह अपने आप पुन: गणना करती है, और — सबसे महत्वपूर्ण बात — अपने परिणाम को cache करती है ताकि यह केवल तभी फिर से चले जब इस पर निर्भर कोई चीज़ वास्तव में बदले।
vue
<script setup>
import { ref, computed } from "vue";
const firstName = ref("Ann");
const lastName = ref("Lee");
const fullName = computed(() => `${firstName.value} ${lastName.value}`);
// fullName updates automatically whenever firstName OR lastName changes
</script>
<template>
<p>{{ fullName }}</p> <!-- auto-unwrapped, like a ref -->
</template>