FEATURE: Exporting the formApi for a Login Form to Facilitate Custom Application Usage

[menglidong]

Version

Vben Admin V5

Description

To enhance the flexibility and functionality of your login form, you can expose the formApi. This allows other parts of your application to interact with the form programmatically, which is particularly useful for specific requirements such as capturing form data on a blur event and sending a request.

Proposed Solution

packages/effects/common-ui/src/ui/authentication/login.vue
and
packages/effects/common-ui/src/ui/authentication/code-login.vue
and
packages/effects/common-ui/src/ui/authentication/forget-password.vue

const [Form, { setFieldValue, validate, getValues }] = useVbenForm(
  reactive({
    commonConfig: {
      hideLabel: true,
      hideRequiredMark: true,
    },
    schema: computed(() => props.formSchema),
    showDefaultActions: false,
  }),
);

==>

const [Form, formApi] = useVbenForm(
  reactive({
    commonConfig: {
      hideLabel: true,
      hideRequiredMark: true,
    },
    schema: computed(() => props.formSchema),
    showDefaultActions: false,
  }),
);
const { setFieldValue, validate, getValues } = formApi;

defineExpose({
  formApi,
});

Alternatives Considered

No response

Additional Context

No response

Validations

• Read the docs
• Ensure the code is up to date. (Some issues have been fixed in the latest version)
• I have searched the existing issues and checked that my issue does not duplicate any existing issues.