Как реализовать Factory Pattern для компонентов в приложении React?

Question

В настоящее время я использую React в своей компании для создания нашего основного программного продукта ... Разработка приложения началась год назад, и мы не ожидали, что наше приложение будет расти так же, как и сейчас.Теперь мы имеем дело с какими-то проблемами, которых можно было бы избежать, если бы мы с самого начала сделали хороший дизайн архитектуры.

Подводя итог, можно сказать, что одной из наиболее важных проблем является дублирование кода.... и большое количество операторов "import" с относительными маршрутами в верхней части каждого нового компонента, который мы создаем ...

Я хотел бы знать, рекомендуется ли для решения такого рода проблем использовать шаблон фабрикиза повторное использование компонентов React и как успешно его реализовать?

Заранее спасибо

Answer 1

Вы могли бы реализовать фабричный шаблон таким способом,

function ReactComponentFactory(contentsJSX){
  // do factory stuff here...
  return <div>{contentsJSX}</div>
}

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