brocoders / redux-async-connect

It allows you to request async data, store them in redux state and connect them to your react component.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

How to dispatch action client side only?

AndrewRayCode opened this issue · comments

My use case: I need some actions to dispatch only on the client side. This includes on first page load. Right now I have something like:

@asyncConnect([{
    promise: ({ store: { dispatch, getState } }) => {
        if( !__SERVER__ ) {
            return dispatch( clientOnly() );
        }
    }
}]);

However this doesn't execute on the client side on first page load. It only executes if I navigate to the page at a later time.

See also erikras/react-redux-universal-hot-example#971

Similar issue here: #55

I think it's not clear how to declare deferred request with redux-async-connect. What are we missing?

commented

I was stuck with doing this as well, you can pass a filter prop to ReduxAsyncConnect. You can do something like:

ReactDOM.render(
  <Provider store={store}>
    <Router render={(props) => <ReduxAsyncConnect {...props} filter={item => !item.deferred} />} history={history}>
      {routes}
    </Router>
  </Provider>,
  dest
);

or whatever you'd like.

Discovered this after being referred to: https://github.com/erikras/react-redux-universal-hot-example/blob/615dfcd2562b8380e1d199b3d840d292358198dc/src/client.js#L39