Home How can I get more than one value from the Redux store in a single statement?

Questions

How can I get more than one value from the Redux store in a single statement?

March 31, 2022

I have this code:

const { user } = useSelector((state) => state.userReducer);
const { other } = useSelector((state) => state.otherReducer);

How could I get in one line those two (or more) values from the store?

const { user, other } = useSelector((state) => ?);

>Solution :

const { user, other } = useSelector((state) => ({ 
  user: state.userReducer,
  other: state.otherReducer
}))

If you use lodash:

import { pick, isEqual } from 'lodash-es';

const { userReducer, otherReducer } = useSelector(
  (state) => pick(state, ['userReducer', 'otherReducer']), 
  isEqual
)

The second param (isEqual) is aimed at resolving the potential performance issue mentioned by @NicholasTower (and is equivalent to react-redux‘s shallowEqual).
Without a shallow object equality function, the component will re-render every time any mutation is committed to that store, regardless of key.