Lesson 6 — Computed properties

Computed from several sources

A computed can read as many refs as it likes; Vue tracks every one it used and recalculates when any of them changes. A classic example is a full name built from a first and a last name typed into two fields.

const w = ref(3), h = ref(4)
const area = computed(() => w.value * h.value) // updates when w or h changes

Why it matters: the template stays simple — {{ fullName }} — while the logic lives in one place.