<el-form :model="orderaddForm" :rules="rulesPhone" ref="orderaddForm" label-width="100px" class="oncall_mesgbox clearfix">
<el-form-item label="联系人电话" prop="new_phone">
<el-input type="text" autocomplete="off" v-model="orderaddForm.contactTelephone"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogaddorder = false">取消</el-button>
<el-button type="primary" @click="submitaddWorkOrderForm('orderaddForm')">提交</el-button>
</div>
注意：
按钮绑定form-：对应model
输入框el-input （v-model）：对应form-model.某名称，自定
vue验证:
data() {
//电话验证
const validatePhone = (rule, value, callback) => {//定义规则
let reg = /^1[345789]\d{9}$/;
if (value != '' && reg.test(value)) {
callback()
} else {
callback(new Error('请输入正确的手机号'))
}
}
return {
rulesPhone: {//电话验证-对应form-:rules
new_phone:[{//对应item-prop
validator: validatePhone,//对应上方规则
trigger: 'change'//修改验证
}]
},
}
延伸：
data form内的对象字段都要（必须）定义：
data() {
return {
orderaddForm:{//form名称一般弹出框
contactTelephone:'',
},
}
}
延伸：
引用函数：
this. functionName()