React-router 按需加载和接口数据获取加载状态怎么显示才合理？

#1

react-router 配合 webpack 的 require.ensure 可以实现模块文件的异步加载，也就是说在加载模块的时候，有一定的延时，尤其是网络差或者页面模块体积比较大的时候，我们需要显示一个加载状态；

在模块加载完之后，我们还需要从服务器获取应用的数据，这也需要加载状态的显示；
我的做法是模块请求的时候，显示 loading，加载完隐藏 loading；
数据请求的 loading 状态直接在模块里面做。
虽然可行，但是不通用，尤其是模块多的时候，比较累

弱弱的请问下你们是怎么做的？

（理想的做法是，将模块和应用数据请求这两部分合并为一个加载状态。。。 ）

#2

关注下

#3

全局loading放在根路由，每次发生ajax的时候触发loading，返回数据之后隐藏loading。

局部loading放在页面内部或者组件内部，部分是在ajax的时候触发，部分是在本地事件机制触发。

#4

楼主找到解决方法了吗？求解

#5

@DuAChao
回过头来想了下，展示可以用onEnter 的时候定义一个promise , require.ensure的时候resolve。（ps：react-router4.0没onEnter了，3.x有）
然后ajax也是一个promise，返回之后resolve这个promise。
最后你要做的就是两个promise之后做点事情。思路感觉没毛病，你们可以试试。