element-ui的坑

总结element-ui遇到的问题,以及常见问题

el-form的model、prop属性和表单校验等详解

Vue 的 el-form 提供了表单校验功能， :rules 属性设置校验规则，并通过 el-form-item 的 prop 属性绑定校验规则。组件封装，让前端校验更方便。
在这个过程当中遇到了一些问题

1. el-form表单

1.1 el-form 的 model 属性

el-form 的 model 属性是用来指定表单使用的数据的，虽然 el-form 指定了 model 对象，但是，理论上，vue 并没有限制 el-input 绑定的数据，el-form 内部的 el-input 组件依然可以绑定其他数据。

但是注意,如果要用 rules 进行表单校验，那么 el-input 绑定的元素必须是 el-form 的 model 的直接属性，否则会导致校验失败。

<el-form :model="groupData" :rules="rules" ref="groupForm">
	<el-form-item label="分组名称：" prop="name">
	  <el-input v-model="groupData.name"/>
	</el-form-item>
</el-form>

这段代码中 el-form 的 model 是 groupData，那么 el-form-item 中所有需要校验的表单的 的 model 也必须是 groupData.xxx ，即 groupData 对象的直接属性。

1.2 el-form-item 的 prop 属性

<el-form-item label="策略名称" prop="strategyName">
            <el-input v-model="data.strategyName" />
</el-form-item>

-----待继续