0 Tage Serie
javascript / beginner
Snippet

Zwei-Wege-Datenbindung mit v-model

Die v-model-Direktive erstellt eine Zwei-Wege-Verbindung zwischen einem Eingabeelement und einer Dateneigenschaft und aktualisiert beide automatisch, wenn sich eines ändert.

snippet.js
javascript
1
2
3
4
5
6
7
8
<template>
<input v-model="form.username">
</template>
<script setup>
import { reactive } from 'vue';
const form = reactive({ username: '' });
</script>
vue
Erklärung
1
v-model="form.username"
Synchronisiert den Eingabewert mit der username-Eigenschaft im form-Objekt.
2
const form = reactive({ username: '' });
Erstellt ein reaktives Objekt, um die Formulardaten zu speichern.