Provide a way to dispatch child async tasks
I have a container component that renders several other container components. Some of those children container components don't show up in the router match but still have data they need to load. It'd be great if there was some way I could explicitly specify in the parent's asyncConnect to call its children's async tasks.
Maybe I could do something like:
const asyncFetch = {
promise: ({store: {dispatch, getState}}) => {
return dispatch(loadViewer());
},
};
@asyncConnect([asyncFetch])
export default class ChildContainer extends Component {
static asyncFetch = asyncFetch;
// ...
};
import ChildContainer from './ChildContainer';
@asyncConnect([
ChildContainer.asyncFetch,
]);
export default class ParentContainer extends Component {
// ...
};
This way if the ChildContainer is in the route match, then it'll trigger the asyncConnect. If not, then the parent must know this and explicitly add it to its own asyncConnect. Works for me, any feedback on this method?
This could work as long as you make sure not to forget this :)