form-create 自定义按钮

修改默认按钮属性

<template>
     <div>
        <form-create v-model:api="fApi" :rule="rule" :option="options"/>
    </div>
</template>

<script>
    export default {
        data(){
            return {
                fApi:{},
                options:{
                     submitBtn: {
                        innerText: '自定义按钮',
                        loading: true,
                        type: 'ghost'
                     }
                },
                rule:[
                    {
                        type:'checkbox',
                        field:'label',
                        title:'标签',
                        value: [],
                        options:[
                            {label:'有用',value:0},
                            {label:'快速',value:1},
                            {label:'高效',value:2},
                            {label:'全能',value:3},
                        ],
                        validate: [{type: 'array', min:3, required: true, message:'最少选择3个'}]
                    }
                ]
            }
            
        }
    }
</script>

隐藏按钮

{
  submitBtn: false,
  resetBtn: false
}

自定义表单操作按钮

<template>
     <div>
        <form-create v-model:api="fApi" :rule="rule" :option="options"/>
        <AButton type="primary" plain @click="submit">自定义提交按钮</AButton>
        <AButton style="margin-left: 10px;" @click="reset">自定义重置按钮</AButton>
    </div>
</template>

<script>
    export default {
        data(){
            return {
                fApi:{},
                options:{
                     submitBtn:false
                },
                rule:[
                    {
                        type:'checkbox',
                        field:'label',
                        title:'标签',
                        value: [],
                        options:[
                            {label:'有用',value:0},
                            {label:'快速',value:1},
                            {label:'高效',value:2},
                            {label:'全能',value:3},
                        ],
                        validate: [{type: 'array', min:3, required: true, message:'最少选择3个'}]
                    }
                ]
            }
            
        },
        methods:{
            submit(){
                this.fApi.submit((formData, fApi)=>{
                    alert(JSON.stringify(formData))
                })
            },
            reset(){
                this.fApi.resetFields()
            }
        }
    }
</script>