Passing in Redux Actions into useEffect's dependencies

Question

I have the predicament of passing in Redux actions into useEffect's dependencies list.

For example,

import { someReduxAction } from '../actions/greatestPathEverMade'

const mapDispatchToProps = () => ({
  someReduxAction
})

const DummyComponent = ({ someReduxAction }) => {
  useEffect(() => {
    someReduxAction()
  }, [someReduxAction])

  return ( .... )
}

I'm 75% sure that the Redux Action is not changing so I can omit it from useEffect's dependency array but my question is mainly: Is it possible for Redux actions to change? Usually, they are constant in that a basic redux action will dispatch a type and payload object.

`someReduxAction` is a function, and I am guessing that it could create a new instance of this function on render — AlexZvl, Nov 20 '19 at 22:04

score 1 · Answer 1 · answered Nov 20 '19 at 22:06

The ESLint exhaustive-deps rule has no way to know whether that function will change to a different reference or not, so it will always tell you that the function needs to be added to the dependencies list. The only exceptions are built-in React functions like a useState setter or useReducer dispatch, which React ensures are stable references, and are hardcoded that way into the ESLint rule.

Passing in Redux Actions into useEffect's dependencies

1 Answers1