Comments (3)
Hmmm, I haven't ran into this yet. However I rarely use the sub callbacks. Typically i've subscribed to the data and then dispatched a {CAMPAIGNS_LOADING: true}
action. Then when the flux helper dispatches a 'changed' action I set the new data from minimongo and also flip the CAMPAIGNS_LOADING
to false. Then my UI will get the loaded and data on the same event loop.
I'm not sure if this is the best way to do this but is how i've been typically using it. Does this help? If not let me know and perhaps we can work something else out.
from meteor-flux-leaderboard.
Ah, yes that absolutely helps. It never crossed my mind to dispatch an additional action for the loading state. So now I have an action creator that looks like this:
Actions.Campaigns = {
campaignsChanged(newDocs) {
return {
type: 'CAMPAIGNS_COLLECTION_CHANGED',
collection: newDocs,
};
},
markLoading() {
return {
type: 'CAMPAIGNS_COLLECTION_LOADING',
};
},
};
And an associated reducer:
const initialState = {
campaignsLoading: true,
campaigns: [],
};
Reducers.campaigns = function campaigns(state = initialState, action) {
switch (action.type) {
case 'CAMPAIGNS_COLLECTION_CHANGED':
return Object.assign({}, {
campaignsLoading: false,
campaigns: [...action.collection],
});
case 'CAMPAIGNS_COLLECTION_LOADING':
return Object.assign({}, state, { campaignsLoading: true });
default:
return state;
}
};
And I can simply use this in my component.
componentWillMount() {
this.sub = Meteor.subscribe('campaigns');
store.dispatch(Actions.Campaigns.markLoading());
},
componentWillUnmount() {
this.sub.stop();
},
Thanks for the help!
from meteor-flux-leaderboard.
No prob!
Also you can cleanup the merge code by using spreads too, babel uses a Object.assign as a polyfill anyway:
case 'CAMPAIGNS_COLLECTION_LOADING':
return {...state, campaignsLoading: true};
Also this may/may-not work depending on race conditions (which could be fixed with a startup wrap but is ugly):
const {dispatch} = store;
const {markLoading} = Actions.Campaigns
...
componentWillMount() {
this.sub = Meteor.subscribe('campaigns');
dispatch(markLoading());
},
from meteor-flux-leaderboard.
Related Issues (12)
- SSR & Immutable Stores? HOT 4
- Subscription
- Version with Alt.js timetravel HOT 8
- Cloning the content of the subscribed collections means 2x memory usage ? HOT 2
- Any plans to complete the Alt example referenced in the readme? HOT 2
- How can I get posts by page id? HOT 2
- Use Collection.observe Instead? HOT 3
- Desperately waiting Redux example. HOT 30
- Still active HOT 14
- Best place to put Subscriptions and Fetchings on Redux? HOT 4
- Redux sample improvement? HOT 8
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from meteor-flux-leaderboard.