Betrachten Sie folgendes Beispiel. Es besteht aus zwei ref Variablen und je einer computed Property, Method und Watcher auf jeder der beiden Variablen. Kreuzen Sie an, was aufgerufen wird, wenn über die Eingabe eines Zeichens im Input-Feld

ein Re-Render getriggered wird:

<script setup lang="ts"
>
import {computed, ref, watch} from "vue"
;
const count = ref<number>(0
);
const countComputed = computed(() => { console.log("countComputed"); return count.value + 1 
});
function countMethod() { console.log("countMethod"); return count.value - 1
; }
watch(count, () => { console.log("countWatch"
); })
const name = ref<string>("Max"
);
const nameComputed = computed(() => { console.log("nameComputed"); return name.value.toUpperCase
(); });
function nameMethod() { console.log("nameMethod"); return name.value.toLowerCase
(); }
watch(name, () => { console.log("nameWatch"
); })
</script
>
<template
>
  <h1>Count</h1
>
  <p>{{ count }} <button @click="count++">Increment</button></p
>
  <p>{{ countComputed }}</p
>
  <p>{{ countMethod() }}</p
>
  <h1>Name</h1
>
  <p><input v-model="name"></p
>
  <p>{{ nameComputed }}</p
>
  <p>{{ nameMethod() }}</p
>
</template>