Я начинаю замечать потенциальную проблему с тем, как я структурирую свое приложение React.
Мне нравится создавать свои компоненты, имея один файл, который действует как контейнер, и несколько компонентов без состояния, которые получают переданные данные. и отправители событий через props. Этот контейнер будет содержать все состояния, вызовы API и обработчики событий. Этот контейнер будет отображать дочерние компоненты без состояния.
Вот пример структуры, которую я использую:
- folder
- index.js <-- container file
- childComponent1.js
- childComponent2.js
- childComponent3.js
- childComponent4.js
...
Размер файла контейнера и количество дочерних компонентов зависит от того, насколько большой особенность есть. Проблема, с которой я столкнулся в последнее время, заключалась в том, что мне пришлось реализовать очень большую функцию, и, хотя мне нравится использовать эту структуру, я начал понимать, что мой контейнерный файл стал очень большим, почти 1000 строк кода. Я не уверен, что это проблема, но меня беспокоит то, что я вижу 1000 строк кода в одном файле. Есть только много состояний для отслеживания, а также обработчики событий для чтения / установки нового состояния.
Мне интересно, есть ли какие-нибудь советы по поводу этого обходного пути или есть другой шаблон проектирования, который Я могу попробовать и поэкспериментировать с. Любой ответ приемлем!
Спасибо!