avue 自定义按钮修改后触发表单自带的校验方法;avue表单提交

 代码:

<avue-form :option="option" v-model="publishForm" ref="publishForm" @submit="handleSubmit">
                <template slot-scope="{size}" slot="menuForm">
                        <el-button :size="size" @click="$refs.publishForm.resetForm()">取 消</el-button>
                        <el-button type="primary" :size="size" @click="$refs.publishForm.submit()">导 出</el-button>
                </template>
</avue-form>

1.触发表单自带的校验方法

给表单定义ref属性,并使用$refs.publishForm触发校验方法

2.avue表单提交

 handleSubmit(form, done) {
            setTimeout(() => {
             this.publishDialogVisible=false
             console.log(form);//表单填写的信息(一般在这里调用后端接口)
             done()//成功后置空表单内容(必须调用否则会出现点击新的表单 内容还未清空现象)
            }, 3000)
 }

猜你喜欢

转载自blog.csdn.net/killerdoubie/article/details/131663094
今日推荐