<Template> <div>{{ getFooById(1) }}</div> </template> <script>

Question

<Template> <div>{{ getFooById(1) }}</div> </template> <script>

export default defineComponent({
setup() {

const fooList = ref([]);

const getFooById = id => {
for (let f of fooList.value) {
if (f.id == id) {
return f.name;
}
}
return '???';
};

setTimeout(() => {
fooList.value = [{id: 1, name: '+++'}];
}, 2000)

return {
getFooById,
};
}
});
</script>

Никто не подскажет, как вуй определяет, что fooList изменился - я понимаю.
А вот как он понимает, что при этом надо перевызвать getFooById?