У меня есть компонент с подключением к редуксу, к которому привязано действие onClick. Каждый раз, когда я щелкаю по нему, происходит повторное рендеринг, хотя я использую хук useCallback . Вот мой упрощенный компонент:

 const Map = props ={amp}gt; { const dispatch = useDispatch(); // from react-redux const coordinates = useSelector(state ={amp}gt; state.track.coordinates); // from react-redux const onClick = useCallback( // from react data ={amp}gt; { return dispatch({type: 'ADD_COORDINATES', payload: data}); }, [dispatch] ); return ( {amp}lt;div className="Map"{amp}gt; {amp}lt;GoogleMap onClick={onClick}{amp}gt; {amp}lt;Track coordinates={coordinates} /{amp}gt; {amp}lt;/GoogleMap{amp}gt; {amp}lt;/div{amp}gt; ); }; 

Без предоставления какого-либо дополнительного контекста и того, что компонент действительно «упрощен» (нет ничего другого, что может вызвать рендеринг), компонент Map будет перерисовывать только на своем родительском рендере:

 const Parent = () ={amp}gt; { const coordinates = useSelector(coordinatesSelector); return {amp}lt;Map /{amp}gt;; }; 

При отправке действия addCoordinates вы можете вызвать его родителя.

Вы должны попытаться запомнить компонент Map :

Если ваш функциональный компонент отображает один и тот же результат с теми же параметрами, вы можете заключить его в вызов React.memo для повышения производительности в некоторых случаях, запоминая результат. Это означает, что React пропустит рендеринг компонента и повторно использует последний результат рендеринга.

  const Map = () ={amp}gt; { ... return ....; }; export default React.memo(Map); 

Изменить после обновления вопроса:

Ваш компонент перерисовывается из-за useSelector как указано в документации:

Когда действие отправлено, useSelector () выполнит эталонное сравнение предыдущего значения результата селектора и текущего значения результата. Если они отличаются, компонент будет вынужден повторно выполнить рендеринг. Если они одинаковы, компонент не будет повторно визуализироваться.

Таким образом, вы можете добавить дополнительные equalityFn :

 const coordinates = useSelector(state ={amp}gt; state.track.coordinates, areSameCoords)