v-model实现双向数据绑定原理

v-model本质上是语法糖，将value与组件标签进行绑定，即属性绑定和事件绑定，当用户行为触发标签身上的事件时会自动让value更新

<template>
    <div>
        <input type="text" :value="message" @input="updateValue($event.target.value)" />
        <p>{{ message }}</p>
    </div>
</template>

<script setup>
import { ref } from 'vue';

let message = ref()
const updateValue = (newValue) => {
    message.value = newValue
}
</script>

<style lang="scss" scoped>
</style>