1. 核心作用与数据流向
v-bind ：实现单向数据绑定 （数据 → 视图），将 Vue 实例的数据绑定到 DOM 属性（如
value、src、class等）。数据变化会同步到视图，但视图修改不会反向更新数据。语法：v-bind:属性名="数据"或简写:属性名="数据"（如:value="name"）。v-model ：实现双向数据绑定 （数据 ↔ 视图），仅适用于表单元素（如 input、select、textarea），视图输入变化会同步更新数据，数据变化也会同步到视图。语法：
v-model="数据"（如v-model="name"）。
2. 适用场景
v-bind ：用于非表单元素的属性绑定（如
img的src、div的class/style、自定义组件的 props 传递），或表单元素的单向绑定场景（仅展示数据，不接收用户输入）。v-model：专用于表单元素的双向交互（如用户输入框、下拉选择器等需要实时同步数据的场景）。
3. 底层实现
- v-model 本质是
v-bind:value+v-on:input的语法糖：例如<input v-model="name">等价于<input :value="name" @input="name = $event.target.value">，通过监听输入事件反向更新数据。- v-bind 仅单纯绑定数据到属性，无事件监听逻辑。
4. 总结
| 特性 | v-bind | v-model |
|---|---|---|
| 数据流向 | 单向（数据→视图） | 双向（数据↔视图） |
| 适用元素 | 所有元素（属性绑定） | 仅表单元素 |
| 底层逻辑 | 单纯属性绑定 | 绑定 value + 监听输入事件 |
| 核心用途 | 展示数据、属性控制 | 表单交互、数据同步 |