[seregzhka]

Коллеги, подскажите пожалуйста.
Есть форма на которой очень много инпутов, чтобы не раздувать файлик до несколько экранов разделил по компонентам, чекбокс отдельно, инпут отдельно и т.д. Потом из них на главной странице собрал всю форму. Получается следующее

class Submit extends Component {
    onSubmitHandler = () => {
        //здесь нужно собрать все данные, которые 
        //ввёл пользователь в кастомных компонентах
    }

    return (
        <div>
            <TextInput .../>
            <TextInput .../>
            <CheckboxCustom .../>
            <CheckBoxCustom .../>
            <ListCategories/>
            ...(еще с десяток контролов)...
            <Button onClick={this.onSubmitHandler}>Submit</Button>
        </div>
    )
}

Кастомные контролы имеют свои состояния где и хранят уже введённое пользователем значение.

Когда нажимаем на submit кнопку, в методе onSubmitHandler нужно собрать все данные из кастомных контролов. И тут есть проблема, я не понимаю как правильно это сделать. Первая мысль, которая пришла - это в каждый контрол передать колбэк, внутри контрола вызывать этот колбэк с обновлённым значением, т.е. таким образом передать значение выше. Т.е. выглядит так

class Submit extends Component {
    categoryId = null;

    onSubmitHandler = () => {
        //this.categoryId - содержит последнее введённой значение        
    }

    handleInput = (key, value) => {
        this[key] = value;
    }

    return (
        <div>
            <ListCategories onSelectedCategory={this.handleInput} .../>
            ...
        </div>
    )
}

Внутри ListCategories уже делаем вызов this.onSelectedCategory('categoryId', 3);
Такой подход работает, но мне кажется, это неправильно. И не могу найти решение по лучше.

Можно было бы все стейты из кастомных компонентов вытащить наружу в класс Submit, но хотелось сделать, чтобы каждый компонент был изолированным со своим состоянием которое присуще только ему.

Есть у кого какие идеи как это решить? Может нужно перестроить компоненты, но как без понятия.