Questions tagged [redux]

1

votes
2

answer
265

Views

React-Redux TypeError: this.props.getAnimals is not a function

When using react, redux and thunk to fetch some data from an API, I am experiencing an error TypeError: this.props.getAnimals is not a function\ which is triggered by the line this.props.getAnimals(); Using Redux Tools, we can see that this.props.getAnimals function was successfully executed, showi...
Nyxynyx
1

votes
1

answer
54

Views

Can I wrap my application with both a redux provider and an apollo provider?

Can I wrap my application with both a from 'react-redux' and an from 'react-apollo' or should I choose one or the other? Several examples I have read on using Apollo for optimistic UI contrast it to creating the same result in redux and how much work that would be. I'm already using redux and redu...
user1283776
1

votes
2

answer
103

Views

Redux form or simple form

Often in the interview questions it is heard that Why one should use redux form in the ReactJs instead of simple form. which extra ordinary facilities it provides to the developer ? Then what should be proper answer for this.
mrpanchal
1

votes
1

answer
423

Views

react redux Parsing error: Unexpected character '​'

Why this error appear? package.json { 'name': 'react-shopping', 'version': '0.1.0', 'private': true, 'dependencies': { '@babel/core': '7.1.0', '@svgr/webpack': '2.4.1', 'babel-core': '7.0.0-bridge.0', 'babel-eslint': '9.0.0', 'babel-jest': '23.6.0', 'babel-loader': '8.0.4', 'babel-plugin-named-asset...
Стас Рябцев
1

votes
1

answer
48

Views

Where is Children from mapStateToProps in redux official todo example?

in https://redux.js.org/basics/exampletodolist#containers-filterlink-js, the code of FilterLink.js is import { connect } from 'react-redux' import { setVisibilityFilter } from '../actions' import Link from '../components/Link' ​ const mapStateToProps = (state, ownProps) => ({ active: ownProps.filt...
new2cpp
1

votes
2

answer
115

Views

RxJS iif arguments are called when shouldn't

I want to conditionally dispatch some actions using iif utility from RxJS. The problem is that second argument to iif is called even if test function returns false. This throws an error and app crashes immediately. I am new to to the power of RxJS so i probably don't know something. And i am using...
E1-XP
0

votes
1

answer
25

Views

How can I measure the duration between 2 actions using redux-observable epic?

I'm trying to measure the duration of 2 actions using redux-observable epic. There is an answer related but it doesn't really help in my situation. In redux-observable, how can I measure the epics duration time when running complete? testeeEpic = action$ => action$.ofType('TEST_START', 'TEST_EMD')...
Lin Shen
1

votes
2

answer
27

Views

React Redux - action failing, parsing error

I'm trying to learn react redux and I'm trying to create a simple example using a shopping list with get, delete and add items. I have an example here that shows it working with get and delete items. My problem is in the reducer with the add item. Here is the same example but with the additem in red...
cdmt
1

votes
1

answer
30

Views

Simple React components won't update after Redux state change

I have the following React component connected to the Redux store, and even though the state of the store changes (I checked), the component prop userIsLogged won't change its value. Any help is appreciated! const mapDispatchToProps = (dispatch) => bindActionCreators({deauthenticateUser}, dispatch)...
heniotierra
1

votes
1

answer
40

Views

Are Pure, Presentational and Dumb Components all the same thing?

Are Pure, Presentational and Dumb Components all the same thing? Basically, stateless functional components, which are concern about How Look and not How Work, and are never connected to Redux store?
user1941537
1

votes
3

answer
46

Views

An object literal cannot have multiple properties with the same name in strict mode

This is mye code: import { combineReducers } from 'redux'; import { postReducers } from './postReducers'; import { stationsReducer } from './TrackCircuitSensorDataFormReducers/StationsReducer'; import { trackCircuitReducer } from './TrackCircuitSensorDataFormReducers/TrackCircuitReducer'; export con...
dawood11
1

votes
2

answer
35

Views

how to Modify a child object from you state in the reducer with Redux

I have a state with multiple objects inside it. Right now I can modify all the elements from the first level, like the step property. But I want to know how to modify the elements from an object inside of my state. Initial state const initialState = { step : 1, user: { identification : { email: ''...
ValRob
1

votes
2

answer
43

Views

not able to share state between two components in react

I have two components-AskQuestion and SingleQuestion I want to pass the data from AskQuestion to SingleQuestion. How to make this.state.form content available in SingleQuestion component. AskQuestion.jsx import React, { Component } from 'react'; import EditableTagGroup from '../EditableTagGroupCompo...
saicharan
1

votes
1

answer
30

Views

Flutter redux How to perform polling

Redux seems to be a very nice architecture for mobile app development. However, mobile apps have some features that are not common for web apps. In my case, I would like to start long polling /monitoring location/tracking file system (any action that watches some external state) after the start of s...
Rostyslav Roshak
1

votes
1

answer
35

Views

run my method when redux change store props. ReactJS

I have a specific problem In my React-Redux app. I use Redux-saga to communication with REST API, and so Redux-saga doesn't return a promise. In my application I also use state (in addition to the store) that I would like to change my state after receiving the SUCCESS response from Redux-saga. My me...
promiseREact2
1

votes
1

answer
54

Views

Redux shorthand `mapDispatchToProps` returns undefined for `async` actions / thunks

I have encountered what I think might be a bug but could be my understanding. Basically an import of an async action returns undefined inside a Redux container, but I know the import is fine (file exists, it's the right case etc etc). On closer inspection, the issue seems to have started when I mig...
dougajmcdonald
1

votes
1

answer
58

Views

expect(…).toHaveBeenCalled() fails even though the React component method is called

I am attempting to test whether a React component method is called using enzyme and jest. The function is supposed to be called when a element becomes unfocused (on blur). The component is connected to a Redux store, but it is also exported by name, to take Redux out of the equation. Below is a sim...
lpytel
1

votes
2

answer
27

Views

How to change a value inside array of object in Redux

I have stored an array of object in Redux State and inside each object there is a key named price. Now when I increment the quantity button I need to access the object that has the key inside redux and change the price value. I was able to do that but it's not working properly the price is being cha...
Kinan Alamdar
1

votes
1

answer
32

Views

return promise from thunk

I'm trying to use my first thunk in redux-thunk: getting redux-thunk into my app which already uses redux-observable: import thunk from 'redux-thunk' export const store = createStore( rootReducer, vepo, composeWithDevTools(applyMiddleware(createEpicMiddleware(rootEpic), thunk)) ) Using it like so: A...
BeniaminoBaggins
1

votes
1

answer
32

Views

Is it efficient to dispatch data from just firebase listeners?

const listRef = firebase.database().ref(); const reducer = (state = {}, action) => { switch (action.type) { case: 'GET_LIST' : { const { list } = action; return { list }; }; case: 'ADD_ELEMENT' : { const { elementId } = action; return { ...state, [elementId]: true }; }; default : return state; }; };...
Gergő Horváth
1

votes
1

answer
18

Views

Calling data from firebase as per pagination

I have firebase real-time database with a field of employee having more than 2000 entries having details of all employees. In my react-app while fetching the list of employees , I have to first fetch the whole employee field data to display the entries causing a lot of loading time. Is there any wa...
Shubham Pratik
1

votes
1

answer
33

Views

React: Redux state updated in one effect but next effect in same component is using previous value of state

Using react 16.8.2, hooks API. Redux initial state: const initialState = { name: one, count: 1, } Component: function CompTwo(props) { useActiveCount(setActiveCount, 2); useEffect(() => { // activeCount is still 1 if(activeCount === 2) { setActiveName('two') } }); } const mapStateToProps = state =>...
HarshvardhanSharma
1

votes
0

answer
8

Views

connect doesn't refresh when state change on react-native with redux

It's been 5 hours that I'm on the problem but decidedly it does not want to work... I would like to dispatch the event when onScroll is detected on my home component and receive the status 'true' or 'false' in my TopNavigation component For now my reducer works well (with a console.log(nextState) be...
Nicolas Taraborrelli
0

votes
0

answer
27

Views

React component not redraw when when props are updated

Quick info to describe the context. I am working to a tree component that receives as prop this kind of data model: workfolder: [{ label: 'test', folders: [ { label: 'label 1', id: 1 }, { label: 'label 2', id: 2 }, { label: 'label 3', id: 3 } ] }]; All data are stored in a Redux store. The initial v...
1

votes
0

answer
20

Views

How we can debug React-Native application?

I am using google chrome for debugging the react native app but in the source code tab, I am not able to see .js files. For debugging I am using physical device. Any body know about the solution? Is there any better method to debug the react native app?
Sahil Kataria
1

votes
0

answer
17

Views

Android back button does not work as expected

My screen should show a spinner util I get a response from the async operation that's running. Expected Behavior Clicking AndroidBackButton while the loading state is true ... I should jump back to the Home screen, and cancel the current op. I determine the loading state by a loading field I pull up...
Hend El-Sahli
0

votes
0

answer
6

Views

`fields` is marked as required in `ReduxForm(<MyComp>)`, but its value is `undefined`

I'm trying to use redux-form // rootRedcer.ts import { combineReducers } from 'redux' import { reducer as formReducer } from 'redux-form' import translation from './translation/reducer' export default combineReducers({ form: formReducer, translation, }) // components/DashboardHome/index.tsx import {...
Nikolay Podolnyy
1

votes
2

answer
17

Views

Duplicating authentication data between the store and localStorage

In many React tutorials I have seen the presence of tokens or some other kind of data in localStorage used to drive authentication state in an app. But if I were to make a header/navbar component that shows a link to 'sign in' or 'sign out' as appropriate for the user's authentication, it appears th...
peterlawless
0

votes
0

answer
7

Views

Redux state is not updating into the react component

How the redux state is updated into the react component? I tried using initial state and not mutating the object and return that Redux const initialState = { filteredProviderData:[], filteredAlsoSpeaksData:[], filteredOfficeHours:[] }; function reducer(state = initialState, action = {}) { s...
user4485357
0

votes
0

answer
4

Views

flutter_redux How to get the value and change it

Using flutter_redux, I found that I can't pass two generics ![Switch](https://i.loli.net/2019/03/23/5c959f97cb971.jpg) body: Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ StoreConnector( converter: (store) { return store.state.count; }, builder: (context, count) {...
user7017462
0

votes
0

answer
11

Views

React. Get access to props of a root component

How can I get access to props of a root component? import React from 'react'; import { render } from 'react-dom'; import { createStore } from 'redux'; import { Provider } from 'react-redux'; import cartReducer from './store/cartReducer' import AddToCart from './cart/addToCart.jsx' const store = cr...
0

votes
0

answer
6

Views

How to use redux-saga with typescript generic type

I have a typescript fetch generic api as below function fetchApi(url: string): Promise { return fetch(url) .then(res => res.json()) } Now I want to code a login async method using redux-saga function* loginAsync(user: UserInterface) { let loginUser = yield call( fetchApi, user ) yield put({ type: 'U...
yuanlai
2

votes
0

answer
7

Views

NGRX Redux store — selecting only a slice of the state returns 'undefined' even if intellisense autocompletes and everything in the model matches

Using @ngrx-redux/store, the latest verson, I can select via string any slice of the state but the moment I Try to access a property, it will return 'undefined' errors everywhere. Syntax: this.loadedClients = this.store.select( state => state.superUser.loadedClients ); if I just do this.loadedClie...
SebastianG
1

votes
0

answer
6

Views

React Context: Provide instance of an Api Manager

I want to keep a single instance of a third party api manager class in my react app. I'm trying to achieve this using using the React Context Api like this: Api Context: import * as React from 'react'; import { ApiManager } from '../ApiManager'; const defaultValue = new ApiManager() const ApiContex...
danielrvt
0

votes
1

answer
22

Views

Closure value changes without being reset

I don't expect someone to solve the problem because there is lots of code missing but maybe I'm missing something here. I'm creating a closure in mergeProps to be used as a delete action. It gets selectedItems from state or data from server if form is not touched yet. User can remove or add items fr...
HMR
0

votes
2

answer
20

Views

How can I pass HTML as props in ReactJS

I have an HTML tag value in my state variable as this.state = { value: 'This is a paragraph' } I want to display this HTML content in my child component. I'm trying to do as So that i can use the props to access the value inside the child component. But this produces some errors. How can I fix thi...
Hareesh
1

votes
1

answer
10

Views

Issues with React Native Navigation

I just faced an issue with react native navigation with 502 Bad Gateway . Have a look at issue for below screenshot . Please help us if any idea on this . Issue Screenshot : https://i.stack.imgur.com/4jCQx.png
user9637368
0

votes
0

answer
3

Views

React + Rails with Redux Persist Gate

I am new to everything as specially to react_on_rails and I am trying to figure out how to use redux-persist with my project so that when I changing the page, I am not losing any redux store. I have figure out the redux setup but I cannot get Redux Persist to work right and it still fails to Uncaugh...
GYTO
0

votes
0

answer
14

Views

Convert Uppercase to Lowercase from Input with redux in react native

I am trying to remove all white spaces with the input. Actually, the input is clubbed with redux, whenever there is an onChangeText , its been props to action and then, getting the value from the props. I need to remove all white spaces after typing finished , or on typing. But couldnt achieve that....
Dazzile Pro
0

votes
0

answer
4

Views

Nav.Link trigger Router

simple example of how to use react-router Know with react-bootstrap Nav.Link using bootstrap Navbar (Color schemes) made the changes below for the simple example but the Route doesn't work anymore. Is it suppose to programmatic detect the click and redirect to the correct page/component or by the cl...
H.C

View additional questions