什么是双向绑定？Vue 是如何实现双向绑定功能的？

双向绑定 = 数据变化自动更新视图 + 用户输入自动更新数据。最典型的场景就是 <input v-model="msg">——你修改 input 的值，msg 跟着变；JS 里改 msg，input 显示跟着变。

Vue 2 用 Object.defineProperty 劫持对象属性的 getter/setter 实现数据 → 视图的响应式，用 v-model 监听 input 事件实现视图 → 数据的反向同步。

Vue 3 换成了 Proxy，能拦截更多操作（属性增删、数组索引），不需要像 Vue 2 那样用 $set 手动处理新增属性。

追问

v-model 的本质是什么？

v-model="msg" 是语法糖，等价于 :value="msg" + @input="msg = $event.target.value"。对于 checkbox 是 :checked + @change，对于 select 是 :value + @change。

双向绑定和单向数据流矛盾吗？

不矛盾。Vue 仍然是单向数据流（父 → 子通过 props，子 → 父通过 emit）。v-model 只是父子通信的一种语法糖，本质上还是 prop + event 的模式。

什么场景不适合用双向绑定？

• 需要在赋值前做复杂转换的（用 computed + emit 更清晰）
• 多个输入源同时修改一个数据的（容易互相覆盖）
• 需要中间确认操作的（如提交时才正式更新）