v-model和：model的区别

场景：在使用el-form时，form上面使用的是:model；而在表单里面的el-input使用的是v-model。那么这两者有什么区别呢？

  <el-form :model="user">
          <div class="title">登录页</div>
          <!-- 登录用户 -->
            <el-form-item>
              <el-input type="text" :prefix-icon="user" v-model="user.userName"/>
            </el-form-item>
            <!-- 登录密码 -->
          <el-form-item>
            <el-input type="psssword" :prefix-icon="view" v-model="user.userPwd"/>
        </el-form-item>

1. v-model:

通常用于表单上双向数据的绑定，如果除了表单其他组件使用时，起不到任何效果。它还可以实现子组件到父组件的双向数据动态绑定。

2. :model

:model是v-bind:model的缩写。

只是将父组件的值传递给和子组件，但是并未实现子组件和父组件之间的双向数据绑定，当然引用类型除外，子组件改变了引用类型的数据的话，父组件的数据也会跟着改变。

区别：el-input 是一个输入控件，需要真实地绑定、处理数据

而 el-form 组件只是用来管理、校验规则等，所以只需要单向绑定。

 附注：v-model 在内部为不同的输入元素使用不同的属性并抛出不同的事件；

        1）text 和 textarea 元素使用 value 属性和 input 事件；
        2）checkbox 和 radio 使用 checked 属性和 change 事件；
        3）select 字段将 value 作为 prop 并将 change 作为事件。

原文链接：https://blog.csdn.net/qq_41926464/article/details/131421633