CFormSubmit 表单提交按钮组件

功能说明

CFormSubmit 是表单提交按钮组件，用于在表单中提供提交按钮。组件支持固定在底部显示，并可以通过插槽自定义按钮文本。

引用方式

import { CFormSubmit } from '@components/forms/form';

组件参数

• fixed (Boolean，可选)：是否固定在底部显示，默认为 false

使用示例

基础用法

<template>
  <CForm :form="form" :onFinish="handleFinish">
    <CFormItem name="username" label="用户名" required>
      <CInput type="text" placeholder="请输入用户名" />
    </CFormItem>
    <CFormSubmit>提交</CFormSubmit>
  </CForm>
</template>

<script>
import { CForm, CFormItem, CFormSubmit } from '@components/forms/form';
import { CInput } from '@components/forms/input';

export default {
  components: {
    CForm,
    CFormItem,
    CFormSubmit,
    CInput
  },
  data() {
    return {
      form: {
        username: ''
      }
    };
  },
  methods: {
    handleFinish() {
      console.log('表单提交成功', this.form);
    }
  }
};
</script>

固定在底部显示

<CFormSubmit :fixed="true">确认提交</CFormSubmit>

自定义按钮文本

<CFormSubmit>
  <view class="custom-btn-text">保存并继续</view>
</CFormSubmit>

注意事项

1. CFormSubmit 组件需要在 CForm 组件内使用，才能触发表单提交和验证
2. 组件内部使用了 form-type="submit" 属性，可以自动触发表单提交
3. 当设置 fixed 为 true 时，按钮会固定在页面底部显示，适用于长表单
4. 可以通过默认插槽自定义按钮的文本内容，默认显示"提交"