Можно ли положить контейнер в компонент в Redux?

Question

Я взламываю React/Redux и строю много контейнеров и компонентов.

Однако недавно я столкнулся дизайн выбор, который я сделал, что сделал на моих элементов выглядеть следующим образом:

Мой вопрос заключается в следующем дизайн OK? В основном я борюсь за то, как передать Redux Actions до кнопки, так как кнопка находится на нескольких уровнях. Я мог бы продолжать передавать действия вниз компоненту в компонент из HeaderContainer, но если DOM станет глубже, это будет все хуже и хуже.

Я чувствую, что этот дизайн НЕПРАВИЛЬНО, поскольку данный компонент вызывает компонент контейнера.

Любые мысли?

Answer 1

У вас есть три варианта:

• Во-первых, чтобы непосредственно подключить компонент кнопки в магазин и пусть это будет как контейнер & презентационный компонент. Простой и эффективный.

  export default connect(mapStateToProps, mapDispatchToProps)(ButtonComponent)

  Смотрите пример от создателя Redux here (4-й пост)

• Во-вторых, создать контейнер, чтобы обернуть кнопку, и пусть кнопку только презентационный - текущая реализация. Очень хорошая многоуровневая архитектура, но для меня это было перестроено.

• В-третьих, необходимо пройти действие от HeaderComponentContainer до ButtonComponent.

---

Я хотел бы пойти на третий, если кнопка не более 2 уровней вложенности, так как вы уже подключили HeaderComponentContainer и как родитель это его ответственность, чтобы определить, какие функции ее дети должны обеспечить (они только присутствуют, верно?).

PS. Вы можете использовать React's context, чтобы передать действия/свойства в арбитраж глубоко в иерархии, не делая явно для каждого компонента.