Блог

 function Notification({ flashMessage }) {
  useEffect(() => {
    if (isEmpty(flashMessage)) {
      return null;
    }
    const dispatch = useDispatch();
    dispatch(uiActions.dispatchNotification(flashMessage));
  }, [flashMessage]);

....


return <div>....</div>
};
  

react-dom.development.js:59 Uncaught Invariant Violation: Invalid hook call. Hooks can only be called inside of the body of a function component.

Может ли отправка не вызываться в перехватчике useEffect?

dispatch может вызываться внутри эффекта, но useDispatch не может. Все перехватчики должны вызываться в теле компонента. Исправление заключается в перемещении useDispatch перед эффектом.

 function Notification({ flashMessage }) {
 const dispatch = useDispatch();
  useEffect(() => {
    if (isEmpty(flashMessage)) {
      return null;
    }
    dispatch(uiActions.dispatchNotification(flashMessage));
  }, [flashMessage]);

  // etc
}