Proper data fetching for ReactJS components and MobX -
what preferred way of data fetching (and posting) in mobx? including option making spinners during onload of external data call.
- all using @actions in store, making components dumb possible, e.g. aim stateless functional components possible.
- in component, e.g. using componentdidmount or willmount
- by use of higher order components
as per mobx documentation, actions should done in mobx actions, in stores suggested first option describe.
the example provide fits quite use case:
@action createrandomcontact() { this.pendingrequestcount++; superagent .get('https://randomuser.me/api/') .set('accept', 'application/json') .end(action("createrandomcontact-callback", (error, results) => { // ^ note: asynchronous callbacks separate actions! if (error) console.error(error); else { const data = json.parse(results.text).results[0]; const contact = new contact(this, data.dob, data.name, data.login.username, data.picture) contact.addtag('random-user'); this.contacts.push(contact); this.pendingrequestcount--; } })); }
Comments
Post a Comment