reduxjs / redux-toolkit

The official, opinionated, batteries-included toolset for efficient Redux development
https://redux-toolkit.js.org
MIT License
10.64k stars 1.15k forks source link

TypeError :subscriptionSelectorsRef?.current.isRequestSubscribed is not a function (it is undefined) in rtk-query-react.development.cjs #4257

Closed ashishimg27 closed 1 week ago

ashishimg27 commented 6 months ago

screenshot-1709804030791

i dont know what is cause of this error can anyone help me

EskiMojo14 commented 6 months ago

have you definitely added the middleware for RTKQ to your store?

ashishimg27 commented 6 months ago

@EskiMojo14 yes store file code -

import { configureStore } from "@reduxjs/toolkit";
import { setupListeners } from "@reduxjs/toolkit/query";

import rootReducer from "app/redux/reducers";
import validateDomainMiddleware from "app/redux/middellware/domain";
import validateSignInWithCredential from "app/redux/middellware/signIn";
import { feeds } from "app/redux/reducers/app/feeds";
import { userById } from "app/redux/reducers/app/user";
import { chats } from "app/redux/reducers/app/chat";
import userSignInMiddleware from "app/redux/middellware/user";
import { profile } from "app/redux/reducers/app/profile";
import rtkQueryErrorLogger from "app/redux/middellware/error";

export const store = configureStore({
  reducer: rootReducer,
  middleware: (getDefaultMiddleware) =>
    getDefaultMiddleware({ serializableCheck: false }).concat(
      validateDomainMiddleware,
      userSignInMiddleware,
      validateSignInWithCredential,
      rtkQueryErrorLogger,
      feeds.middleware,
      userById.middleware,
      chats.middleware,
      profile.middleware
    ),
});

setupListeners(store.dispatch);
haasampath commented 5 months ago

Please check your middleware order, that can be matters, i have had the similar experience...

EskiMojo14 commented 5 months ago

i think middleware order shouldn't matter as long as every middleware definitely returns the result of calling next(action) (apart from cases where it's specifically intending to return something different)

const brokenMiddleware = api => next => action => {
  console.log(api.getState())
  next(action)
  console.log(api.getState())
}

const workingMiddleware = api => next => action => {
  console.log(api.getState())
  const result = next(action)
  console.log(api.getState())
  return result
}

you should also make sure no middleware is marked with the async keyword, which will cause every dispatch result to be wrapped in a promise

const brokenMiddleware2 = api => next => async action => {
  console.log(api.getState())
  const result = next(action)
  console.log(api.getState())
  return result
}
markerikson commented 1 week ago

Closing due to lack of info.