State transformation

In some cases it may be necessary to transform the form state before it is passed to the validator.

You can do this by providing getSnapshot property.

Omit extra data

One of the transformation options you can apply is deleting unnecessary data.

For this you can use omitExtraData function.

Note

The omitExtraData function does not perform data validation!

<script lang="ts">
  import { defaultMerger } from '@sjsf/form/core'
  import { createForm } from "@sjsf/form";
  import { translation } from "@sjsf/form/translations/en";
  import { theme } from "@sjsf/basic-theme";
  import { omitExtraData } from "@sjsf/form/omit-extra-data";

  import { schema, uiSchema, initialValue } from "./schema";
  import { validator } from "./validator";

  const form = createForm({
    theme,
    initialValue,
    schema,
    uiSchema,
    validator,
    translation,
    getSnapshot(ctx) {
      return omitExtraData(validator, defaultMerger, schema, $state.snapshot(ctx.value))
    },
    onSubmit(value) {
      console.log("transformed", value);
    },
    onSubmitError(errors, _, value) {
      console.log("errors", errors);
      console.log("transformed", value);
    }
  })
</script>