javascript / beginner
Snippet
Two-Way Data Binding with v-model
The v-model directive creates a two-way connection between an input element and a data property, updating both automatically when either changes.
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
Breakdown
1
v-model="form.username"
Syncs the input value with the username property in the form object.
2
const form = reactive({ username: '' });
Creates a reactive object to hold the form data.