redux-thunk

Redux: Using async middlewares vs dispatching actions on success functions

人盡茶涼 提交于 2019-12-18 17:25:27
问题 I am trying to integrate Redux into my React project. Currently I'm not using any Flux framework. My app gets some data from the API and displays it in a pretty way, like so: componentDidMount() { getData(); } getData() { const self = this; ajax({ url: apiUrl, }) .success(function(data) { self.setState({ data: data, }); }) .error(function() { throw new Error('Server response failed.'); }); } In reading about Redux, I've settled on two possible approaches that I could use for handling storing

Warning: Failed prop type: The prop `store` is marked as required in `Provider`, but its value is `undefined`. in Provider

断了今生、忘了曾经 提交于 2019-12-18 13:12:13
问题 How to resolve this error in react-redux project error screenshot Warning: Failed prop type: The prop store is marked as required in Provider , but its value is undefined . in Provider import React from 'react'; import ReactDOM from 'react-dom'; import App from './App'; import './index.css'; import SignUp from './Components/SignUp' import SignIn from './Components/SignIn' import Home from './Components/Home' import { Router, Route, hashHistory, IndexRoute, browserHistory } from 'react-router'

Warning: Failed prop type: The prop `store` is marked as required in `Provider`, but its value is `undefined`. in Provider

送分小仙女□ 提交于 2019-12-18 13:11:15
问题 How to resolve this error in react-redux project error screenshot Warning: Failed prop type: The prop store is marked as required in Provider , but its value is undefined . in Provider import React from 'react'; import ReactDOM from 'react-dom'; import App from './App'; import './index.css'; import SignUp from './Components/SignUp' import SignIn from './Components/SignIn' import Home from './Components/Home' import { Router, Route, hashHistory, IndexRoute, browserHistory } from 'react-router'

React + Redux, How to render not after each dispatch, but after several?

倖福魔咒の 提交于 2019-12-18 12:58:23
问题 I am trying to make multiple changes to the store, but not render till all changes are done. I wanted to do this with redux-thunk. Here is my action creator: function addProp(name, value) { return { type:'ADD_PROP', name, value } } function multiGeoChanges(...changes) { // my goal here is to make multiple changes to geo, and make sure that react doesnt update the render till the end return async function(dispatch, getState) { for (let change of changes) { dispatch(change); await

Dispatching action from onUploadProgress event using Redux-Thunk / Axios

允我心安 提交于 2019-12-14 02:17:42
问题 The following code uploads a file no problem and responds successfully or failing as expected, however, I cannot figure out how to dispatch my uploadFileProgress action from the onUploadProgress event. I can console.log the progress / percentage and when I try to wrap the dispatch in an IIFE, I trigger a dispatch is not a function error. Hopefully this is a small issue I'm missing. Thanks in advance! export function uploadFile(values, callback = () => {}) { const uploadFileData = new FormData

Redux thunk: return promise from dispatched action

断了今生、忘了曾经 提交于 2019-12-13 12:04:46
问题 Is it possible to return promise/signal from action creator, resolved when Redux thunk has successfully dispatched certain action? Consider this action creator: function doPost(data) { return (dispatch) => { dispatch({type: POST_LOADING}); Source.doPost() // async http operation .then(response => { dispatch({type: POST_SUCCESS, payload: response}) }) .catch(errorMessage => { dispatch({type: POST_ERROR, payload: errorMessage}) }); } } I want to call some function asynchronously in the

React Redux: Uncaught Invariant Violation (Objects are not valid as a React child)

Deadly 提交于 2019-12-13 02:53:56
问题 The error I'm receiving is "react-dom.development.js:55 Uncaught Invariant Violation: Objects are not valid as a React child (found: object with keys {counter}). If you meant to render a collection of children, use an array instead." It occurs when I change Counter.js from <p>{this.state.counter}</p> to <p>{this.props.counter}</p> From my understanding, I'm using the mapStateToProps and mapDispatchToProps and I should be able to pull at least the initialState of the counter, which is 0. I'm

React.default.memo is not a function (React-Native) wrapWithConnect

删除回忆录丶 提交于 2019-12-12 08:18:14
问题 I get this the error _react.default.memo is not a function and wrapWithConnect . This is a react-native project and it worked fine before I used the connect function to connect my dispatch into my react component: Package Versions: "react": "16.5.0", "react-redux": "^6.0.1", "redux": "^4.0.1", "redux-logger": "^3.0.6", "redux-thunk": "^2.3.0", code const mapDispatchToProps = dispatch => { return { sendEmail: (email, navigateMap) => dispatch(sendEmail, navigateMap)) export default connect(null

Generic TypeScript Type for functions returning functions that replaces the ReturnType with the ReturnType of the returned function

我与影子孤独终老i 提交于 2019-12-12 01:03:29
问题 Dear TypeScript-3-Gurus out there, can someone help my define a generic type GuruMagic<T> that does the following? T is a function returning a function, e.g. this: fetchUser(id: Id) => (dispatch: Dispatch) => Promise<boolean> The generic type should then replace the ReturnType of fetchUser with the ReturnType of the returned function. Like this: type dispatchedAction = GuruMagic<typeof fetchUser>; // so that dispatchedAction === (id: Id) => Promise<boolean> I know that I can apply ReturnType

Component is not unmount after its delete in store

你。 提交于 2019-12-11 14:27:10
问题 Project (Todolist) was created with immutable library, source here Store structure: project have many tasks , In redux store: State - map, projects, tasks - Records When I asyncly remove project ... export const removeProject = project => (dispatch) => { if (!isProjectExist(project)) return Promise.resolve() return projectService .delete(project) .then( () => { dispatch(remove(project)) console.log("post removeProject resolved") }, handleError, ) } .... that was created after initialization -