#简介

v-model 是Vue中用于表单控件（如input, textarea等）的一个指令，其本质是一个语法糖。它实现了视图（View）与数据模型（Model）之间的双向绑定。这意味着，当表单控件的值发生变化时，Vue会自动更新相关数据；反之，当数据发生变化时，视图也会自动更新以反映最新数据。

#示例

          
1
2
          <input type="text" v-model="message">
<p>Message is: {{ message }}</p>

        

#原理

1. 绑定value属性
2. 监听input事件，获取到最新值后赋值给绑定的value属性

          
1
2
3
          <input type="text" v-model="message">
{/* 等价于 */}
<input type="text" :value="message" @input="message = $event.target.value">