redux-async-connect icon indicating copy to clipboard operation
redux-async-connect copied to clipboard

The sample client code in usage doesn't work.

Open shilei812 opened this issue 8 years ago • 2 comments
trafficstars

https://codesandbox.io/s/gL3zJKv9Z

`import { Router,Route , browserHistory } from 'react-router'; import { ReduxAsyncConnect, asyncConnect, reducer as reduxAsyncConnect } from 'redux-async-connect' import React from 'react' import { render } from 'react-dom' import { createStore, combineReducers } from 'redux'; import {Provider} from 'react-redux'; // 1. Connect your data, similar to react-redux @connect @asyncConnect({ lunch: (params, helpers) => Promise.resolve({id: 1, name: 'Borsch'}) }) class App extends React.Component { render() { // 2. access data as props const lunch = this.props.lunch return (

{lunch.name}
) } }

// 3. Connect redux async reducer const store = createStore(combineReducers({reduxAsyncConnect}), window.__data);

// 4. Render Router with ReduxAsyncConnect middleware render(( <Provider store={store} key="provider"> <Router render={(props) => <ReduxAsyncConnect {...props}/>} history={browserHistory}> <Route path="/" component={App}/> </Router> </Provider> ), document.getElementById('root'))`

result

Error in index.js: TypeError: asyncItems.map is not a function OPEN MODULE

shilei812 avatar Apr 28 '17 07:04 shilei812

Have the same issue

lnikell avatar May 05 '17 10:05 lnikell

.map only works on arrays which the code in @asyncconnect isn't - it's an object. I'm not using this at the moment but from memory you need to add an array like this:

@asyncconnect([{ lunch: (params, helpers) => Promise.resolve({id: 1, name: 'Borsch'}) }])

tomCollinson avatar Sep 25 '17 14:09 tomCollinson