Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(form): add valueFormat for schema #3873

Merged
merged 1 commit into from
May 31, 2024

Conversation

electroluxcode
Copy link

@electroluxcode electroluxcode commented May 24, 2024

General

✏️ Mark the necessary items without changing the structure of the PR template.

  • Pull request template structure not broken

Type

ℹ️ What types of changes does your code introduce?

👉 Put an x in the boxes that apply

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to not work as expected)
  • This change requires a documentation update

添加 valueFormat方法 和 isHandleDefaultValue 属性(用来判断valueFormat是否对默认值生效)

例如下面例子,在upload组件的 field1中绑定的值只能是 string[] 格式的值。假如数据格式要求是要string格式的值,那么需要做额外的处理。现在可以通过 valueFormat这个方法,直接把field1 变成string格式的

<template>
  <Alert message="新功能测试" />
  <BasicForm @register="registerValiate" class="my-5" />
</template>

<script setup lang="ts">
  import { Alert } from 'ant-design-vue';
  import { BasicForm, FormSchema, useForm } from '@/components/Form';
  import { useMessage } from '@/hooks/web/useMessage';
  import { uploadApi } from '@/api/sys/upload';

  const { createMessage } = useMessage();

  const schemasValiate: FormSchema[] = [
    {
      field: 'field1',
      component: 'ImageUpload',
      label: '字段1',
      defaultValue:["https://avatars.githubusercontent.com/u/1"],
      componentProps: {
        api: uploadApi,
        maxNumber:1
      },
      valueFormat:({value})=>{
        return value[0]
      },
    }
  ];
  const [registerValiate, { getFieldsValue: getFieldsValueValiate}] = useForm({
    labelWidth: 160,
    schemas: schemasValiate,
    actionColOptions: {
      span: 18,
    },
    submitFunc: () => {
      return new Promise((resolve) => {
        resolve();
        console.log(getFieldsValueValiate());
        createMessage.success(`请到控制台查看结果`);
      });
    },
  });
</script>

@wangjue666 wangjue666 merged commit 0bc01d8 into vbenjs:main May 31, 2024
2 checks passed
@vbenjs vbenjs locked and limited conversation to collaborators Aug 2, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants