Questions tagged [redux-toolkit]

Redux Toolkit (RTK) is the standard approach for writing Redux logic. It provides utilities to simplify several common Redux use cases, including store setup, defining reducers, immutable update logic, and even creating entire "slices" of state at once.

Redux Toolkit (RTK) is the standard approach for writing Redux logic. It provides utilities to simplify several common Redux use cases, including store setup, defining reducers, immutable update logic, and even creating entire "slices" of state at once.

Redux Toolkit was originally created to help address three common concerns about Redux:

  • "Configuring a Redux store is too complicated"
  • "I have to add a lot of packages to get Redux to do anything useful"
  • "Redux requires too much boilerplate code"

It provides tools that abstract over the setup process for Redux and handle the most common use cases, as well as include some useful utilities that will let the user simplify their application code.

RTK is beneficial to all Redux users. Whether you're a brand-new Redux user setting up your first project, or an experienced user who wants to simplify an existing application, Redux Toolkit can help you make your Redux code better.

3505 questions
1
vote
0 answers

Selector for multiple instances

I am working on an application that can include multiple instances of components, for example, a component that reorders one data set into a new data set. There can be a large number of these "reorder components" open in the application, with the…
Dan L
  • 235
  • 4
  • 12
1
vote
1 answer

Property 'type' is missing in type 'AsyncThunkAction; }>' but required in type 'AnyAction'

I'm trying to dispatch an action (don't know if it's the right name, because I'm really new to redux and redux-toolkit) and I'm getting this error: Argument of type 'AsyncThunkAction; }>' is not…
juliano.net
  • 7,982
  • 13
  • 70
  • 164
1
vote
1 answer

Is there any specific usage advantage/disadvantage in using createSlice() over createReducer() other than the boilerplate reduction

I've referred to a couple of links, including https://github.com/reduxjs/redux-toolkit/issues/81. But it's answered long back in 2019 and not quite helpful.
quepayal
  • 57
  • 2
  • 12
1
vote
1 answer

Redux-toolkit: Store does not have a valid reducer . Make sure the argument passed to combineReducers is an object whose values are reducers

i dont know why its showing me an error i not even started the coding yet i just writtened a configureStore syntax given by documentation and i uploaded into index.js file via provider here is my app .js import logo from './logo.svg'; import…
user12381629
1
vote
0 answers

Redux-toolkit createEntityAdapter

The following code works as intended. The state gets populated using the createEntityAdapter. import { createSlice, createAsyncThunk, createEntityAdapter } from '@reduxjs/toolkit'; export const fetchUsers = createAsyncThunk('users/fetchUsers',…
Wasteland
  • 4,889
  • 14
  • 45
  • 91
1
vote
1 answer

Update cart items quantity and price with @reduxjs/toolkit in react native

I have a cart state that holding array something like this: [[{"Id": 123, "duration": 10, "name": "Burger", "price": 10, "qty": 1, "total": "10.00"}]] and this is the reducers as showing I have added to more for increase and decrease the…
anie
  • 399
  • 5
  • 17
1
vote
0 answers

Getting error "cannot add property 0, object is not extensible" when switching from edit page to new creating page

I have a component where user can create a company with some information like company name, company branch name etc. In this component I have two tabs one is company information and other is branch information. If user trying to create a new company…
1
vote
2 answers

How to deal with the dependency between two async thunks

I have two async thunks created by createAsyncThunk() function of redux-toolkit. E.g. const getOrder = createAsyncThunk('a/getOrder', async (_, thunkAPI) => { // `userId` from API.getUser() // I tried to get the `userId` from redux store, but…
Lin Du
  • 88,126
  • 95
  • 281
  • 483
1
vote
1 answer

Handle onSnapshot subscription in createAsyncThunk

Currently i try to connect firebase / firestore to the redux store of my react-native project. I've created a reducer with the createSlice function of @reduxjs/toolkit const authSlide = createSlice({ name: 'auth', initialState: initialState, …
Stevetro
  • 1,933
  • 3
  • 16
  • 29
1
vote
1 answer

Redux Toolkit - action from one slice to be caught in another slice

There's an action (addOrder) in an orderSlice orderSlice.js import { createSlice } from '@reduxjs/toolkit'; const initialState = { orders: [] }; const ordersSlice = createSlice({ name: 'orders', initialState, reducers: { addOrder: { …
Wasteland
  • 4,889
  • 14
  • 45
  • 91
1
vote
1 answer

TypeScript: Can not retrieve the type of property of another type

I am using create-react-app and its typescript template, but when trying to retrieve the type of the property 'pending' in 'GenericAsyncThunk' like in redux-toolkit docs like this: type PendingAction = ReturnType; I…
1
vote
0 answers

Why is the entire list re-rendered after updating one element in the entityAdapter selector from redux-toolkit?

I have a feed slice: const feedSlice = createSlice({ name: 'feed', initialState: { reposteds: repostedsAdapter.getInitialState(), comments: commentsAdapter.getInitialState(), authors: authorsAdapter.getInitialState(), groups:…
Pauldasslier
  • 116
  • 4
1
vote
1 answer

Updating array within array redux

I've got state with a nested array that looks like the following: { list: [ { id: '3546f44b-457e-4f87-95f6-c6717830294b', title: 'First Nest', key: '0', children: [ { id:…
LeoVannini
  • 95
  • 3
  • 11
1
vote
1 answer

Property does not exist on type - redux-thunk await dispatch

I have this exact issue described here https://github.com/reduxjs/redux-toolkit/issues/485#issuecomment-610654378 so I imported ThunkDispatch directly and am using that. I can't get any keys from the response of dispatch without it throwing property…
azium
  • 20,056
  • 7
  • 57
  • 79
1
vote
1 answer

How do I update a nested Item in a different reducer (slice) with redux toolkit in a React app

I have the following code (I deleted most of it to make it easier to understand - but everything works): "role" reducer: // some async thunks const rolesSlice = createSlice({ name: "role", initialState, …
PixAff
  • 309
  • 4
  • 14
1 2 3
99
100