How do I get the value of a react-jsonschema form using a usestate hook to save the formData without clearing the form values

Question

I am using the onchange function that the form(https://react-jsonschema-form.readthedocs.io/en/latest/) provides to get the values but unable to save the values with my usestate hook.

<Form
  schema={schema}
  disabled={formattedAddresses.length < 1}
  uiSchema={uiSchema}
  widgets={widgets}
  onSubmit={onSubmit}
  onChange={(e) => {
    const { formData } = e
    console.log('formData', formData)
    setAssetId(formData.assetId)
    setFromAddress(formData.wallet)
  }}
/>

Answer 1

You need to pass your state data through formData prop:

const [data, setData] = React.useEffect(undefined);

<Form
  schema={schema}
  disabled={formattedAddresses.length < 1}
  uiSchema={uiSchema}
  formData={data}
  widgets={widgets}
  onSubmit={onSubmit}
  onChange={(e) => {
    const { formData } = e
    console.log('formData', formData)
    setAssetId(formData.assetId)
    setFromAddress(formData.wallet)
  }}
/>

Form will put data into your data object automatically. You can check it with useEffect hook:

React.useEffect(() => {
  console.log(data);
},[data]);