关于element表单验证的问题

Question

表单是根据后台的给的数据循环遍历出来,表单类型也不一样的如代码：
v-if="list.dataIndex=='time'"
v-model="formInline[data.dataIndex]"
type="date"
placeholder="选择日期">
vue中定义rules
data(){
return{
rules:{
name:[
{required:true,message:'不可为空',trigger:'blur'},
]
},
}
}
我的问题是，很多页面都需要用这个验证，都是重复的，我想问一下，有没有什么方法，不用每个页面都写一遍rules，还有就是好多表格的验证规则是一样的，能不能写成一个，大家都用

Answer 1

当然可以。创建一个rules.js文件exportconstrules={name:[{required:true,message:'不可为空',trigger:'blur'},]}调用的js直接import进来就好了。import{rules}from'./rules.js';

Answer 2

可以。把el-form封装成一个自定义组件，比如叫做CustomForm.vue.里面设计好各个el-form-item（比如el-input，el-select等等），以及你要的rules。这样就可以只写一次。各页面如需使用el-form，直接引用这个组件就好，通过prop传入数据.