Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Ensure rendering order with async trigger calls #14

Closed
wants to merge 2 commits into from

Conversation

autarc
Copy link

@autarc autarc commented Feb 11, 2016

The updated example solves the previous issue (#13).

invoke('fetch', components, locals) // Fetch mandatory data dependencies for 2nd route change onwards
.then(() => trigger('defer', components, locals)) // Fetch deferred, client-only data dependencies
.then(() => trigger('done', components, locals)) // Finally, trigger 'done' lifecycle hooks
.then(callback);

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

is all this working for you? because from my point of way this will defer transition until all is resolved when hooked to history.listenBefore

@autarc
Copy link
Author

autarc commented Feb 21, 2016

@svrcekmichal It does. Since the callback is automatically called after all hooks are resolved - the transition applies just like before. The only difference is the execution order which happens as expected and therefore gets the data before calling rendering.

@svrcekmichal
Copy link

@autarc thats what I am talking about, @markdalgleish don't want to wait for data. He want component to be rendered without data with loading indicators and then fetch data and re-render

look at this issue

@jaredpalmer
Copy link

@autarc I don't think you should use redial for this use case. All you need is little helper function like:

// fetchComponentData.js
export default function fetchComponentData(dispatch, components, params) {
  const needs = components.reduce( (prev, current) => {

    return current ? (current.needs || []).concat(prev) : prev;
  }, []);

  const promises = needs.map(need => dispatch(need(params)));

  return Promise.all(promises);
}

If you search github for 'fetchComponentData', you'll find 5 or 6 repos using this as a resolver.

@markdalgleish
Copy link
Owner

Sorry, closing this for the same reason as #19.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants