Обновить данные Graphql

У меня есть базовый компонент, у которого будет QueryRenderer для извлечения данных для заголовка, списка продуктов питания, параметров фильтрации. В методе рендеринга я хотел бы отобразить заголовок, FoodList и FilterSidebar. Теперь, щелкая элемент в FilterSidebar, я меняю состояние в redux, которое, в свою очередь, используется в качестве переменных для QueryRender. QueryRender снова обновляет данные с новыми фильтрами. Проблема в том, что заголовок и панель фильтров также находятся внутри метода рендеринга queryrender, все компоненты обновляются. Есть ли способ справиться с этой ситуацией, когда только список изменяется на основе новых переменных.

Может быть, реализовать shouldComponentUpdate для рассматриваемых компонентов? С помощью redux вы обычно создаете более мелкие компоненты и подключаете их к магазину, чтобы вам не приходилось этого делать.

Herku 19.11.2018 14:03

И действительно ли это проблема? Единственное влияние должно быть на производительность, иначе вы что-то делаете не так. Прежде чем вообще приступить к оптимизации, убедитесь, что вы оптимизируете узкое место. Уровень вашего вопроса не означает, что вы находитесь на той стадии, когда вам следует оптимизировать рендеринг React.

Herku 19.11.2018 14:05

цель почты - иметь корневой QueryRenderer [ограничение вызова api graphql одним запросом], и он будет предоставлять данные контейнеру дочерних фрагментов. Однако дочерний компонент может изменить параметр фильтра, поэтому переменные запроса необходимо изменить. Изменение переменных запроса повторно отображает все компоненты

Ankit Gupta 20.11.2018 08:14
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Массив зависимостей в React
Массив зависимостей в React
Все о массиве Dependency и его связи с useEffect.
0
3
66
0

Другие вопросы по теме