So over complicated. Let's see, dataLoaded implies a boolean value but it's a function that's actually called on every render (so why not just make it a boolean) displayUsers is an async function that never actually does anything async (it calls another async function but doesnt await it). You're storing the api response in a global variable which is just begging to cause bugs. Offloading everything into generic actions and states makes it much harder to follow. I don't see you setting loading to false when you've finished fetching, only on error. I could go on but my point is youve tried to show how data fetching could be simple, with one of the most awkward and convoluted examples ever.
I have not published the 'index.js' part, perhaps it will make you understand my way of doing so.
And in fact, when I say simpler I refered precisely to this part...
importReactfrom"react";importReactDOMfrom"react-dom";importAppfrom"./App";importmergefrom"mergerino";import{stream,scan}from"flyd";varActions=update=>{return{loadData:results=>update({data:results,loading:false}),setLoading:status=>update({loading:status})};};varinitialState={start:false,data:[],loading:false};// reactive variablevarupdate=stream();// kind of Redux :-)varstates=scan(merge,initialState,update);// actions triggered from the viewvaractions=Actions(update);// view = f(state, actions)ReactDOM.render(<Appstates={states}actions={actions}/>, root);
I let the example as it is, in order to have comments on it :-)
Don't hesitate to read my others posts and correct me
Also you can read my later post on this subject : reactQuery
Regards
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
So over complicated. Let's see, dataLoaded implies a boolean value but it's a function that's actually called on every render (so why not just make it a boolean) displayUsers is an async function that never actually does anything async (it calls another async function but doesnt await it). You're storing the api response in a global variable which is just begging to cause bugs. Offloading everything into generic actions and states makes it much harder to follow. I don't see you setting loading to false when you've finished fetching, only on error. I could go on but my point is youve tried to show how data fetching could be simple, with one of the most awkward and convoluted examples ever.
Hello,
+1 for not awaiting...and others.
I have not published the 'index.js' part, perhaps it will make you understand my way of doing so.
And in fact, when I say simpler I refered precisely to this part...
I let the example as it is, in order to have comments on it :-)
Don't hesitate to read my others posts and correct me
Also you can read my later post on this subject :
reactQuery
Regards