A. Docs are available here or you can use old branch on GitHub.

A. Right now, there are two standard ways how to update the second component:

1) Set subscription

subscription={{values: true}}

All fields will be updated when values are changed. It will hurt the performance, but in small forms it should be ok.

2) use formSpy

<FormSpy subscription={{values: true}}>
{(formState) => <CustomComponent />}

A. Use useFormApi.change(name, value) function that allows you to set any value you need.


You can divide the form by using default sub-form components.

"component": "sub-form",
"title": "Subform",
"description": "This is a subform",
"name": "subform",
"fields": [
"name": "carrot",
"label": "Carrot",
"component": "text-field"

Or you can easily implement your own component:

import useFormApi from '@data-driven-forms/react-form-renderer/dist/cjs/use-form-api';
const Section = ({fields}) => {
const { renderForm } = useFormApi();
return (<div>

A. You have probably mixed different DDF modules. Please see optimization page.