Questions tagged [redux]

10135 questions
1

votes
1

answer
825

Views

Best practice for updating individual state properties with Redux Saga

So I'm working on implementing an application in React with Redux Saga and I'm kind of baffled at how little information there is out there for my particular use case, as it doesn't seem that strange. Quite possibly I am using the wrong terms or thinking about the problem in the wrong way, as I am r...
rosalindwills
0

votes
1

answer
20

Views

How to avoid sending multiple duplicate AJAX requests in axios

Is it possible to automatically throttle all requests going to a particular list of endpoints using axios? Perhaps using axios interceptor? Currently I throttle the user action that sends the axios request, but the problem with that is that I have to write this everywhere I have a user action that r...
ManavM
1

votes
1

answer
1.3k

Views

Angular-Redux Epics

Getting the following error message in console when using the angular-redux library. Also, Redux won't catch or listen for actions after the error occurs. I've searched, including the documentation but nothing points out to fix the error. Am I missing something? Error core.js:1427 ERROR Error: Actio...
Ben Isaac
1

votes
2

answer
431

Views

React Native, Redux, and Fetch: “Possible Unhandled Promise Rejection (id: 0)”

I am loading JSON data from a Webpage into my React Native app, and would like to store the data in Redux. I'm currently using Fetch like so: fetch('https://foo.com/product-data/product1.json') .then((response) => response.json()) .then((responseData) => this.state.productLoad(responseData)); where...
Steve
1

votes
2

answer
1.1k

Views

React Dropzone + Redux form validation doesn't work

I'm adding a file input to a Redux form with React Dropzone. Validation function is called and the correct error is returned, but I the values for error and tocuhed do not change: The field render method: export const renderDropzoneField = function({ input, name, id, meta: { touched, error } }) { r...
0

votes
0

answer
3

Views

How to normalizing data from the server in easy way in ngrx

I'm using ngrx/redux pattern in my app. In Normalizing State Shape article, is it written that I should create a 'table' for each object and link between them by an id. for example: posts = [{ id, author, comments: ['commentId1', 'commentId2'....] }] comments = [{ id: 'commentId1', comment: '..' }...
Jon Sud
2

votes
0

answer
23

Views

How to check if user is logged in before redirecting to login page using local storage and react-redux?

I'm using HOC for authenticated routing. I want to check if there is a logged in user in local storage before the redirecting to the login page, but when the app loads it first redirects and then checks in local storage. App.js class App extends Component { render() { return ( ( ()} /> )} /> ); } }...
1

votes
1

answer
370

Views

React & Reselect selector claims state is the same after update

I am implementing Reselect in my project and have a little confusion on how to properly use it. After following multiple tutorials and articles about how to use reselect, I have used same patterns and still somethings dont work as expected. My selector: const getBaseInfo = (state) => state.Info; con...
Kiper
1

votes
2

answer
249

Views

How does Redux Reselect memoization work?

i am trying to integrate reselect into my current up and as always , first i begin to read documentation and then if it needed , another recources.I couldn't understand one special part of documentation and also couldn't find recources which would explain in a more clear way.Now i am here to get som...
Norayr Ghukasyan
1

votes
2

answer
307

Views

Django Rest Framework DELETE returns no content in the body

I am using Django Rest Framework and I am making a DELETE request. As opposed to POST, PUT, PATCH, which all return the state of the object post creation/modification, delete does not return anything in the body (just the 204 code). Having this information would be helpful when trying to tie respon...
Andrei Cioara
1

votes
2

answer
600

Views

Redux - call action from a function

I'm trying to call a redux action from a function. The component that I'm calling the function from is already connected to the store. However, it doesn't work if I pass the action such as: function myFunc(action) { action() } Is there a way to pass an action via a parameter? Thank you.
batatop
1

votes
1

answer
215

Views

Django rest-auth Token authentication

I'm trying to use axios to get information from the /rest-auth/user/ page. This is my function: export const fetchUser = () => { const token = localStorage.getItem('token'); return dispatch => { dispatch(fetchUserPending()); axios.get('http://localhost:8000/api/v1/rest-auth/user/', {headers: { 'auth...
peter176
1

votes
2

answer
1.1k

Views

Cannot read property 'getState' of undefined error

I am trying to add the react sticky header to my stepper. but the problem is if I add inside my App.js its not rendering. so I started debugging the App.js code. if I give console inside my render method of App.js its not displaying console.log('App---->'); right now I am getting Cannot read pro...
no ssr
0

votes
0

answer
13

Views

How to get get username (or any other data) of the logged in user with React/Redux

What would be the best/securest way to store a users logged in data (mainly username or uuid) so I can use it in my other components? I have thought of several ways to do it.. Upon login/signup, store username in local storage, and remove it when authsession ends. (Very easy to implement, but most l...
Tesuji
1

votes
1

answer
461

Views

How to fetch data by existing redux action with hooks?

I'm trying to understand React Hooks. What I want is to fetch data inside functional component by call redux action with useEffect hooks. I know that I can pass props to state like const [todoList] = useState(props.todoList) But what is the best practice to fetch data by existing redux actions? In...
Masaj
1

votes
2

answer
30

Views

Does getState() from redux thunk changes the actual state

I'm retriving a slice of the state with getState() to filter some values from the state in an event handler (before dispatching an action and updating the store with the new state slice) But changing the results from getState seems to change the actual store. Consider the following: const filterInPl...
docHoliday
1

votes
2

answer
42

Views

how to avoid immutation in redux

I have a problem with a mutation I can't understand, here is my code : const copyItems = Object.assign({}, state.items); for(const typeItems of Object.values(copyItems[0])){ for(let items of typeItems){ if(items.id === action.item.id){ Object.assign(items, action.item); } } } return state.items; I...
Zeyukan Ich'
1

votes
1

answer
46

Views

Display html markup in react jsx

Wanted to display straight up html markup into my template. Here is the file where I am writing html code that I want to display. I want to display all the html elements. import React from 'react'; const html = ( 1 2 3 ); export default html component file import React, { Component } from 'react';...
Richard Bustos
1

votes
1

answer
62

Views

How to use previous state properties in reducer

I want to increment the adult property of passenger object from my store const store = { //... passenger: { adult: 1, child: 0 } ///... } In my reducer I have if (action.type === actionTypes.ADD_ADULT) { return { ...state, adult: state.passenger.adult + 1 }; } but of course I get a mistake 'Cannot r...
Yas'ka
1

votes
3

answer
81

Views

Getting “undefined” trying to create a function

So what I want to do, is filter through an array use forEach() and for each session check the dayOfWeek it is on (Monday, Tuesday, ... ). If it is a certain day, it will multiple the price and the duration of the session to come up with an income for that day and add it to the 'mondayIncome', 'tuesd...
josephT
1

votes
2

answer
37

Views

How to connect redux to a none default component

I have a file with multi component that I want to export and connect all to redux, how can I do this? Connect wrapper need to export default, but I have multi component.
Mohsen Md
1

votes
3

answer
50

Views

How can I get the response from dispatch?

I have a component which has a form where at the moment to do clic on submit button, I call a function handleSubmit (it is on my component), this function call an action through of dispatch and this action, I make a call to a service (HTTP Request). handleSubmit handleSubmit = (e) => { e.preventDefa...
Hoose
1

votes
1

answer
51

Views

why I am not getting updated props value in react

could you please tell me why not getting updated props value in react. here is my code https://stackblitz.com/edit/react-redux-basic-counter-1e8gdh?file=shared/components/NavBar.js In my example I have a button - .on click it decrement the value. I dispatch the action value is decremented but I am n...
user944513
1

votes
1

answer
28

Views

TypeScript and Redux: Why do I need to add ` | undefined` to my Reducer state type?

Why can I not just type my reducer simply like this, without adding ' | undefined' to my redux state type? const reducer: Reducer = function(state: ReduxState, action: any) ... Extra context:::: This works OK: export const reducer: Reducer = function ( state: ReduxState | undefined, action: any...
jf1234
1

votes
0

answer
13

Views

Firebase signInWithEmailAndPassword not firing .then() until after UI focus changes

I'm using firebase .signInWithEmailAndPassword(email, password).then() for authentication in a react-native Android project. I have the function called on an onPress button event. The authentication does take place but for some reason, the .then() does not fire unless I tap somewhere else on the sc...
Ryu Kent
0

votes
1

answer
8

Views

ReactJS - After component mounts need to import/rerun local javascript file

Need to import 'validation.js' file within another javascript file in reactjs once the main file render method is completes it execution import './Validations'; should render this JS file once the main component's render method complete its execution
Sriram Karthick
0

votes
1

answer
15

Views

Action invoked without dispatching it - Redux

I am trying to understand redux and is having some doubts regarding mapDispatchToProps. The code is as follows. import * as actions from '../../redux/actions'; import './style.scss' class Center extends Component { componentDidMount() { this.props.getCenters(); } ... } export default connect(state...
prajeesh
0

votes
0

answer
3

Views

GET files from aws s3 bucket in a react page

How can i get all files hosted in AWS S3 bucket ? I would like you to create a single page application that will load a list of files stored in Amazon S3.I am looking for a single front end page, one RESTful endpoint, and one AWS SDK call on the backend.The frontend should be done in React/Redux - s...
sruthi varghese
0

votes
0

answer
10

Views

Can we use React Context for containers as well?

This is React's explanation for use of Context Context is designed to share data that can be considered “global” for a tree of React components, such as the current authenticated user, theme, or preferred language. While this holds good for React components, is it practical to consider using con...
Edison D'souza
0

votes
0

answer
25

Views

how to map nested array within a mapped array in reducer

TLDR:How would i better map an array within a initalState prop The following code im trying to attempt is to retrieve all postIds from the like array, and compare post.id to like.postId However like.postId is undefined. post.id is available on the console log, the difference between posts, and likes...
Mr Patel
0

votes
0

answer
14

Views

How to access mapStateToProps in the same component which it is being used?

I have the following code sample: const mapStateToProps = (state) =>{ return{ items:state.items, input:state.input, state:state } } function fetchData(){ console.log(this.props.state) } export default connect(mapStateToProps)(List) Supposedly, after the function fetchdata be called, it should consol...
Roger Peixoto
0

votes
0

answer
15

Views

How to pass value from api call to initialState in reducer

I'm trying to make it possible to like a post, and allow it update without re rendering the page. The following code allows a user to like a post, but only on refresh i am able to see the updated like count. the likes is from the mapped Posts Array like this and i get the number of likes on a post...
Mr Patel
-2

votes
0

answer
27

Views

How to pass arguments to a function inside compose?

I have a function like so: export const fireView = (prop1, prop2) => WrappedComponent => class extends Component { //stuff in here } then a hoc like this: export const withFireView = (prop1, prop2) => fireView(prop1, prop2) but now I want to put this function inside compose as I need to call it wit...
Red Baron
1

votes
1

answer
1.8k

Views

react-redux upload file errors

I try to implement file uploading on react-redux using redux-form, but there are a warning and an exception in the console: Warning: ConnectedField is changing an uncontrolled input of type file to be controlled. Input elements should not switch from uncontrolled to controlled (or vice versa). Dec...
svnvav
1

votes
1

answer
676

Views

Using multiple react apps in page with relevant stores

I have a comment app in react: require('console-polyfill') import 'babel-polyfill' import React from 'react' import ReactDOM from 'react-dom' import App from './app/app.js' import { makeid } from 'shared/services/helpers.js' import { Provider } from 'react-redux' import store from './app/services/st...
Philll_t
1

votes
1

answer
1.5k

Views

Slow state update in redux

So I have this problem where a variable update is slower than a route change. When I have an error on for example my registration view, the error shows up instantly. When press back to come back to the login view, the error is being reset (action 'clearErrors' is being fired on componentWillUnmount)...
Anders Ekman
1

votes
2

answer
1.4k

Views

React Redux Saga Event Channel Cancel

Is there any possible way via something like a side effect in Redux Saga to cancel an eventChannel? Given an eventChannel connecting to an external event/data stream, in this case a Firebase realtime database 'child_added' event: // action const types = { SYNC: 'SYNC_TODOS' }; function syncTodos(tod...
Alexander Staroselsky
0

votes
1

answer
15

Views

Why importing with curly brace causes issue?

I have checked this question regarding the difference between importing with/without curly braces. In my case, I have a class: class PathResolver extends Component { //content } export default connect()(PathResolver); If I use import { PathResolver } from '/path'; rather than import PathResolver fr...
PhoenixPan
0

votes
0

answer
4

Views

React-Testing-Library - Wrapping Component with Redux and Router

I am trying to setup an test file to render a route/page on my application. I'm trying to wrap everything with Redux and Router, and this is what I have: import React from 'react'; import { render } from 'react-testing-library'; import { createStore } from 'redux'; import { Provider } from 'react-re...
Phillip
1

votes
2

answer
750

Views

Redux Reducer is returning an [Object Object] , However i want string?

I am trying to change state of a const in redux. i am trying my dispatch directly in the component i want to change the state in. The State is changed after dispatch,However i get back an Object. And when i Console.log , i get [Object][Object] , which before calling dispatch i used to get the Value...
codemt

View additional questions