Questions tagged [redux]

Redux is a pattern and library for managing JavaScript application state, using events called "actions". It serves as a centralized store for state that is needed across your entire application, with rules ensuring that the state can only be updated in a predictable fashion. Redux make it easier to understand when, where, why, and how the state in your application is being updated, and how your application logic will behave when those changes occur.

Redux is a pattern and library for managing and updating application state, using events called "actions". It serves as a centralized store for state that needs to be used across your entire application, with rules ensuring that the state can only be updated in a predictable fashion. It is inspired by the architecture.

The patterns and tools provided by Redux make it easier to understand when, where, why, and how the state in your application is being updated, and how your application logic will behave when those changes occur. Redux guides you towards writing code that is predictable and testable, which helps give you confidence that your application will work as expected.

Redux Toolkit 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


Useful Links

Related tags

35457 questions
87
votes
7 answers

When should I add Redux to a React app?

I'm currently learning React and I am trying to figure out how to use it with Redux for building a mobile app. I'm kind of confused on how the two are related/usable together. For example, I completed this tutorial in React…
user3802348
  • 2,502
  • 11
  • 36
  • 49
87
votes
2 answers

How to listen for specific property changes in Redux store after an action is dispatched

I am currently trying to conceptualize how to handle dispatching an action in a component based on a data change after a dispatch in another component. Take this scenario: dispatch(someAjax) -> property in state updates. After this, I need another…
Jazzy
  • 6,029
  • 11
  • 50
  • 74
87
votes
4 answers

Read Store's Initial State in Redux Reducer

Initial state in a Redux app can be set in two ways: pass it as the second argument to createStore (docs link) pass it as the first argument to your (sub-)reducers (docs link) If you pass initial state to your store, how do you read that state…
cantera
  • 24,479
  • 25
  • 95
  • 138
86
votes
10 answers

Error with Redux DevTools Extension using TS: "Property '__REDUX_DEVTOOLS_EXTENSION_COMPOSE__' does not exist on type 'Window'."?

I'm getting this error on my index.tsx. Property 'REDUX_DEVTOOLS_EXTENSION_COMPOSE' does not exist on type 'Window'. Here is my index.tsx code: import * as React from 'react'; import * as ReactDOM from 'react-dom'; import App from './App'; import…
85
votes
7 answers

Timeout feature in the axios library is not working

I have set axios.defaults.timeout = 1000; I stopped the server that provides me with the APIs. But it takes more than 1s to timeout after sending a request. This is how my request looks: import axios from 'axios'; axios.defaults.timeout =…
shet_tayyy
  • 5,366
  • 11
  • 44
  • 82
81
votes
12 answers

"Error: You may not call store.getState() while the reducer is executing."

I just upgraded my fully functional react-native app to Redux v4, but now I am getting the following error: Error: Error: Error: Error: You may not call store.getState() while the reducer is executing. The reducer has already received the state as…
bbrodsky
  • 762
  • 1
  • 5
  • 18
81
votes
10 answers

React router redirect after action redux

I'm using react-redux and react-router. I need to redirect after an action is dispatched. For example: I have registration a few steps. And after action: function registerStep1Success(object) { return { type: REGISTER_STEP1_SUCCESS, …
ximet
  • 1,106
  • 2
  • 9
  • 15
81
votes
3 answers

What is the point of the constants in redux?

For example from this example: export const ADD_TODO = 'ADD_TODO' export const DELETE_TODO = 'DELETE_TODO' export const EDIT_TODO = 'EDIT_TODO' export const COMPLETE_TODO = 'COMPLETE_TODO' export const COMPLETE_ALL = 'COMPLETE_ALL' export const…
m0meni
  • 16,006
  • 16
  • 82
  • 141
80
votes
2 answers

how to get onUploadProgress in axios?

I'm little bit confused that how to upload progress event with axios. Actually I am storing huge number files into aws s3. For that, how to get uploaded progress? I need this function onUploadProgress Currently my Post request is like this: export…
Nane
  • 2,370
  • 6
  • 34
  • 74
79
votes
23 answers

How to type Redux actions and Redux reducers in TypeScript?

What is the best way to cast the action parameter in a redux reducer with typescript? There will be multiple action interfaces that can occur that all extend a base interface with a property type. The extended action interfaces can have more…
Roman Klimenko
  • 1,297
  • 1
  • 12
  • 24
78
votes
3 answers

why we cannot pass boolean value as props in React , it always demands string to be passed in my code

Even though I have applied propType validation, my editor throws an error on when passing boolean value for the hasvacancy prop. Here is what I'm seeing: Error: 'SyntaxError: JSX value should be either an expression or a quoted JSX text' I know…
Vishnu Shekhawat
  • 1,245
  • 1
  • 10
  • 20
78
votes
2 answers

How to sync Redux state and url hash tag params

We have a list of lectures and chapters where the user can select and deselect them. The two lists are stored in a redux store. Now we want to keep a representation of selected lecture slugs and chapter slugs in the hash tag of the url and any…
JoKer
  • 1,074
  • 1
  • 8
  • 11
77
votes
8 answers

Reset state to initial with redux-toolkit

I need to reset current state to initial state. But all my attempts were unsuccessful. How can I do it using redux-toolkit? const showOnReviewSlice = createSlice({ name: 'showOnReview', initialState: { returned: [], }, reducers: { …
Zireael
  • 875
  • 1
  • 6
  • 5
77
votes
7 answers

How to add multiple middleware to Redux?

I have one piece of middleware already plugged in, redux-thunk, and I'd like to add another, redux-logger. How do I configure it so my app uses both pieces of middleware? I tried passing in an array of [ReduxThunk, logger] but that didn't…
doctopus
  • 5,349
  • 8
  • 53
  • 105
77
votes
5 answers

return promise from store after redux thunk dispatch

I am trying to chain dispatches with redux thunk function simple_action(){ return {type: "SIMPLE_ACTION"} } export function async_action(){ return function(dispatch, getState){ return dispatch(simple_action).then(()=>{...}); } } How do I…
l2silver
  • 3,283
  • 6
  • 23
  • 28