Element-UI 中的form 为什么一定要绑定model ?
你是否有这样的困惑，为什么form表单中model一定是必传的？ 为什么添加校验规则的时候，form-item中的prop也是必传的？组件内部究竟是怎么设计的？ 这两个属性有什么必然的联系呢？
form中的model
model是el-form 用来挂载数据的一个对象。理论上vue 并没有限制表单元素v-model绑定的数据一定要挂在一个对象上，你当然可以在form中某个input上绑定一个变量，此时model的任何变化都与这个变量无关。但是，一旦你涉及到表单校验、表单reset等方法调用时，你会发现这个model对象是必须要传的。那我们似乎明白了，model的存在和表单校验有一定联系？重置表单值，清空校验也和mode有一定的关系？
别急，打开element源码看看（让开，我要开始装杯了）
在form.vue中 总共有两处用到了model对象，一个是resetFields这个方法
一个是validate这个方法，实际上这两个方法都是调用的子组件form-item中的方法
form源码比较简单，主要是接收一些全局属性，和暴露了一些全局的方法。
dispatch
引人注意的是element 封装了一个全局通信的方法，可以学习一下。在form-item组件中为了达到和form组件的数据通信，调用了一个dispatch方法。
dispatch方法在src-mixins-emitter.js中，主要是通过向上查找的方式，找到对应的组件，然后利用vue的emit事件传递一个方法，方法可带上参数。
然后在父组件el-form中，通过this.$on就可以用来接收这个事件了。
这样的话就能解决组件深层嵌套的时候数据通信的问题。
form-item中的model
form-item中也封装了一个validate方法，这也是表单校验的核心方法。
首先通过getFilteredRule获取到当前表单元素的rules，可以看下在getRules中，通过收集form上绑定的rules 和 form-item绑定的rules合成一个数组。这个数组就是用来存储校验规则的。
回到validate方法中，把元素自身的prop作为属性存到一个descriptor对象中。然后作为参数调用并传入AsyncValidator这个类（第三方校验表单的库，感兴趣的自行研究）。validator回调函数中会返回当前的校验结果，传入的错误提示等。
表单元素的prop和表单验证息息相关，密不可分。
resetField是用来重置表单值的，重置以后，表单绑定的所有值恢复到初始化状态。记得三年前一直把resetField当做用来清空表单值的方法使用，直到出了线上bug，才对这个方法有了新的认识。
这个方法中通过model对象、元素绑定的prop作为属性key ，找到对应的初始值，然后进行初始化赋值。
注意：model中的属性如果没有初始值的话会被复制为undefined，此时v-model的双向绑定失效
model的另外一个作用就是用来获取表单元素的值
model 通过prop调用getPropByPath(model, path, true).v拿到对应的值。这个值是表单校验的重要依据。换句话说，你的校验能不能通过就是拿到这个值去rules中对比的。
总结
model在el-form中的作用
-
model用来获取表单元素的值
-
model是表单校验的重要数据对象，通过model和prop的结合找到表单元素绑定的值
-
model在resetField方法中用来重置初始值
-
model在fieldValue中获取初始值