Redux, лучший способ получить доступ и использовать состояние внутри промежуточного программного обеспечения

Question

У меня есть ситуация, когда мне нужно отправить два параметра в моих почтовых запросах с использованием axios на все мои конечные точки. Эти параметры уже есть в моем магазине.

Итак, я создаю «промежуточное ПО» для обработки всех моих запросов следующим образом:

const POST = async (url, body = {}) => {
  const {Token, UserId} = store.getState().User
  const {DeviceIdentifier} = await GetDeviceInfo()
  const data = {AgentId: UserId, DeviceId: DeviceIdentifier, ...body}
  const response = await axios.post(`${BASE_URL}${url}$`, data, {
    headers: {Authorization: `Bearer ${Token}`},
  })

  if (!response.data.Logged) {
    logoutUser()
    return false
  }

  return response
}

Но я читал много статей о том, что такое getState () не очень хорошая идея ...

Каким должен быть лучший подход в такой ситуации?

Большое спасибо!

Answer 1

Использование getState() в промежуточном программном обеспечении совершенно нормально - вот почему оно есть!

Если вы хотите прочитать подробное обсуждение некоторых гипотетических проблем и моих причин, почему это все еще нормально, мой пост Идиоматическое Redux: мысли о Thunks, Sagas, Abstraction и Reusability , перейдите к дальнейшим деталям .

Answer 2

При использовании избыточного thunk вы можете указать два аргумента dispatch и getState. Чтобы предоставить больше аргументов:

const store = createStore(
  reducer,
  applyMiddleware(thunk.withExtraArgument({ url, body }))
)

// .withExtraArgument(url) // to supply further one arguments only

И тогда вы можете использовать getState как:

const POST = async (dispatch, getState, {url, body = {}}) => {
  ...
  getState().User