how to validate the form after the component is split
<component
:maintainStatus="maintainStatus"
:maintainTitle="maintainTitle"
:maintainCodeIpt="maintainCodeIpt" //
:maintainNameIpt="maintainNameIpt" //
@confirmEvent="confirmEvent"
@cancelEvent="cancelEvent"
>
</component>
:
<template>
<div>
<Modal
:value="maintainStatus"
:title="maintainTitle"
:maskClosable="false"
>
<Form :label-width="110" ref="formValidate" :model="formValidate" :rules="ruleValidate" :show-message="false">
<Row>
<Col span="24">
<FormItem label=":" prop="maintainCodeIpt" class="formItemMargin">
<Input type="text" v-model="formValidate.maintainCodeIpt" placeholder=""/>
</FormItem>
</Col>
</Row>
<Row>
<Col span="24">
<FormItem label=":" prop="maintainNameIpt" class="formItemMargin">
<Input type="text" v-model="formValidate.maintainNameIpt" placeholder=""/>
</FormItem>
</Col>
</Row>
</Form>
<Row slot="footer" type="flex" justify="end">
<Col>
<Button type="success" @click="confirmEvent"></Button>
<Button class="cancelButton" @click="cancelEvent"></Button>
</Col>
</Row>
</Modal>
</div> < / template >
< script >
export default {
props:{
formValidate:{
maintainCodeIpt:{
type:String
},
maintainNameIpt:{
type:String
}
},
ruleValidate:{
maintainCodeIpt:[
{ requires:true,message:"!",trigger:"blur"}
],
maintainNameIpt:[
{ requires:true,message:"!",trigger:"blur"}
]
},
maintainStatus:{
default:false,
type:Boolean
},
maintainTitle:{
type:String,
}
},
data(){
return {
}
},
methods:{
confirmEvent(){
this.$emit("confirmEvent")
},
cancelEvent(){
this.$emit("cancelEvent")
},
}
}< / script >