makeomatic / makeomatic/redux-connect

How to use with redux-thunk ?

Open
#125 1 comment 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
545
Forks
61
PR merge metrics
No merged PRs in 30d

Description

hi,
my action is like this
```
import axios from 'axios';
export const FETCH_USER = 'FETCH_USER';

export function fetchUsers(){
return function(dispatch) {
axios.get(`http://localhost:3000/api/endpoint`)
.then(response => {
//return response;
dispatch( { type: FETCH_USER, payload: response} );
});
}
}
```
please tell me how to connect this using asyncConnect ?

I tried this.

import React, { Component, PropTypes } from 'react';
import { compose } from 'redux';
import { connect } from 'react-redux';
import { fetchUsers } from '../store/reducers/user_action';
import { asyncConnect } from 'redux-connect';

const $asyncConnect = asyncConnect([{
key: 'user',
promise: ({ store, helpers }) => {
const { user } = store.getState().user;
if (user) {
return Promise.resolve({data:user});
}
return store.dispatch(fetchUsers());
},
}])
class Test extends Component {
componentWillMount() {
this.props.fetchUsers();
}
render() {
var { user } = this.props;
return (


Test


{
user?user.value:'loading...'
}

);
}
}
function mapStateToProps(state) {
console.log(state);
return {
user:state.user.user
};
}
const $connect = connect(mapStateToProps, { fetchUsers });
export default compose($asyncConnect, $connect)(Test);

but not done.
please tell me how to do this ?

Contributor guide

No contributing guide indexed for this repository

Research direction

Start with the supplied redux-thunk action in ../store/reducers/user_action and the Test component's asyncConnect and connect composition. Read the project's asyncConnect usage guidance and compare it with this example; the issue is complete only when the expected integration and rendered user data are clearly documented.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react
Domain
frontend
Issue type
Documentation
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
20/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.