表单输入与绑定

v-model 的原理

<template>
  <input v-model="username" />
</template>

<script setup>
	import { ref } from 'vue'
  
  const username = ref('')
</script>

等价于

<template>
  <input :value="username" @input="handler" />
</template>

<script setup>
	import { ref } from 'vue'
  
  const username = ref('')
  
  const handler = (e) => {
    username.value = e.target.value
  }
</script>