Search code examples
reduxdependency-injectionreact-reduxredux-thunkredux-toolkit

How to add more than one extra argument to Redux Thunk


The following code block describes how to add extra argument to redux thunk.

In my case I am applying dependency injection and I need to pass more than one argument to the Thunk, so is there any solutions other than gathering all arguments in just one object and pass it to the extraArgment thunk property.

import { configureStore } from '@reduxjs/toolkit'
import rootReducer from './reducer'
import { myCustomApiService } from './api'

const store = configureStore({
  reducer: rootReducer,
  middleware: (getDefaultMiddleware) =>
    getDefaultMiddleware({
      thunk: {
        extraArgument: myCustomApiService,
      },
      serializableCheck: false,
    }),
})

Solution

  • No. That's literally the solution. You have only one extra. Of course you can make it an object and add all the things you need as properties. You could also pass a DI container in there or something. That's up to you.