use useEffect to respond to Redux state change

Viewed 761

I need something to run every time a prop changes. With React classes, I could do:

componentDidUpdate(prevProps) {
  if (prevProps.x !== this.props.x) {
    // do something
  }
}

I know in hooks it should be useEffect with a dependency array:

useEffect(() => {
  // do something
}, [props.x])

But I need to do something outside of the useEffect scope.

In my case, I need a function within an onChange to run only when the Redux state has changed:

const Editor: React.FC = () => {
  const { options } = useSelector((state: RootState) => state.settings)

  <CodeMirror
    onChange={(editor, data, value) => {
    // I need to do something only when prev state is different
    if (prevOptions !== options) {
      editor.refresh()
    }
  />

I can't figure out how to do this, besides possibly setting a flag outside of the function component when a change happens and manually setting it back.

0 Answers
Related