Можно ли в состоянии React хранить компонент?

Question

[Mark]

Изучаю React на тестовом проекте.

Есть компонент Exercise, и его дочерние Set.
При добавлении нового Set - он записывается в массив: this.state.sets()

Но сегодня слышал, что этого делать не стоит, но деталей не узнал. Можно ли хранить в Состоянии другие Компоненты? Если нет, почему?

Демо&Код компонента: https://codesandbox.io/s/inspiring-haze-uycjb?file...

Иллюстрация:

Comments

[Алексей Уколов]

В чём польза хранения в стейте всего экземпляра компонента по сравнению с хранением только пропсов, которые в компонент будут переданы?

[Mark]

Алексей Уколов, хочу узнать как правильнее будет.

Значит подход следующий:
1. В this.state.sets записать plain object с пропсами.
2. Передавать их в представление ExerciseView.
2. На основе plain object'ов sets - создавать компонет Set. Примерно так:

sets.map(set) => {
<Set
            key={set.id)}
            number={set.number}
            filledListener={set.listener}
        />
}

Верно?

[Алексей Уколов]

Обычно делают именно так. Хранить экземпляр компонента мне в голову не приходило и я не видел, чтобы кто-то так делал, поэтому я даже не могу сказать плохо ли это по какой-то причине.

[Mark]

Алексей Уколов, буду следовать практике, которую Вы описали. Спасибо.

По поводу того, что использовал я - тут минус в том, что неудобно идентифицировать нужный компонент в массиве, чтобы его удалить/дублировать/др. Неудобно осматривать данные компонента. Но преимущество, что не надо синхронизировать наименования в plain object, и самом Set. Но собственно, это всё не имеет значение.

Хорошего дня!

Answer 1

[Alexandroppolus]

Хранение компонента - это производный стейт, а значит плохая практика.