I want to access to my redux-toolkit store data inside of the rtk-query
endpoints.
how can I access my store from query
or transformResponse
methods?
import { createApi } from '@reduxjs/toolkit/query/react'
import customFetchBase from './customFetchBase.js'
import { setUserInfo, setUserPermissions } from '../features/userSlice.js'
import { aesDEC } from 'src/util/public.util.js'
export const authApi = createApi({
reducerPath: 'authApi',
baseQuery: customFetchBase,
endpoints: builder => ({
getUser: builder.mutation({
query: () => ({
url: '/Account/Login/GetUserInfo',
method: 'POST',
body: {
RequestVerificationToken: salt //here I want the salt from my redux store
}
}),
transformResponse: response => {
return aesDEC(response.data, salt); //here I want the salt from my redux store
},
}),
})
export const { useGetUserMutation } = authApi
Neither query
nor transformResponse
have direct access to the Redux state, however, you can replace both with the queryFn
which does. With queryFn
the query function used is passed the query arg
, the base query api
object, any defined extraOptions
, and the baseQuery
function. Use api.getState
to access the current state value.
Example, your code might look similar to the following:
export const authApi = createApi({
reducerPath: 'authApi',
baseQuery: customFetchBase,
endpoints: builder => ({
getUser: builder.mutation({
queryFn: async (arg, api, extraOptions, baseQuery) => {
const state = api.getState();
const salt = state./* path to salt state value */;
try {
const { data } = await = baseQuery({
url: '/Account/Login/GetUserInfo',
method: 'POST',
body: {
RequestVerificationToken: salt
}
});
return { data: aesDEC(data, salt) };
} catch(error) {
return { error };
}
},
}),
})
});