面试题：v-model 原理？Vue3 多 v-model 怎么用？

常见问法

• 「v-model 是语法糖吗？」
• 「自定义组件怎么实现 v-model？」

本质（Vue2）

在普通元素上（如 input），近似等价于：

:value="msg" @input="msg = $event.target.value"

即：props 下行 + 事件上行 的组合。

在自定义组件上，Vue2 默认：

• prop：value
• 事件：input

Vue3 变化（重要）

默认使用：

• prop：modelValue
• 事件：update:modelValue

这样可支持 多个 v-model：

<MyComp v-model:title="title" v-model:visible="show" />

对应 props：title / visible，事件：update:title、update:visible。

修饰符

• .lazy：change 而非 input 更新（常用于 textarea）。
• .number / .trim：类型与字符串处理。

面试加分

说明 单向数据流 未破坏：父数据仍是唯一来源，子通过 emit 请求父更新；v-model 只是父子协定的语法糖。