Vue中表单组件的实现(模拟elementUI)

强调vue语法

createElement 函数是用来生成 HTML DOM 元素的
Vue.js 里面的 createElement 函数，这个函数的作用就是生成一个 VNode节点，render 函数得到这个 VNode 节点之后，返回给 Vue.js 的 mount 函数，渲染成真实 DOM 节点，并挂载到根节点上。

Vue 的$mount() 为手动挂载，
在项目中可用于延时挂载（ 例如在挂载之前要进行一些其他操作、 判断等）
之后要手动挂载上。 new Vue时， el和$mount并没有本质上的不同。

this.$destroy()内部銷毀組件

async-validator是一个表单的异步验证的第三方库

// 基本用法
var schema = require('async-validator'); // 引用组件
var descriptor = {
 name: {
  type: "string",
  required: true,
  validator: (rule, value) => value === 'muji',
 }
}; // 定义一个descriptor
var validator = new schema(descriptor); // descriptor分配给schema，创建一个validator
validator.validate({name: "muji"}, (errors, fields) => {
 if(errors) {
  // validation failed, errors is an array of all errors
  // fields is an object keyed by field name with an array of
  // errors per field
 return handleErrors(errors, fields);
 }
  // validation passed
}); // 参数一：要验证的对象、参数二：回调函数

v-mod是语法糖，实现自定义组件双绑需要指定:value和@input即可

**其中要思考的问题
1 input是自定义组件，它是怎么实现双向绑定的
2 formItem是怎么知道执行校验的，它是怎么知道input状态的？它是怎么获得对应的数据模型的
3.form是怎么进行全局校验的 它用什么方法把数据模型和校验规则传递给内部组件？**

index.vue

Form

FormItem

Input