antd-pro中loading状态的dva-loading使用

antd-pro中loading状态的dva-loading使用

新项目中使用antd-pro框架，所以接下来会写一些关于antd-pro的踩坑

传统写loading状态的方法是，在异步请求的开始的时候开启loading，在异步请求的结束关闭loading，

这样的写法是比较麻烦的，因为这一部分的操作都是比较一致的，在ant Design pro中就直接用了dva-loading插件，封装的很好，用起来也很方便，主要就是直接监听异步的effect，分别在开始和结束的时候改变loading状态，所以是和dva结合在一起用的,下面时使用方法：

插件引入

import createLoading from 'dva-loading';

const app = dva();

app.use(createLoading());

使用

在项目上注册之后routes组件会有loading对象

@connect(({ app, loading }) => ({ app, loading }))(App);

监听单个effect

let isLoading = loading.effects['role/addRole'] //监听role下的addRole的异步请求

监听某个模块下的所有异步请求

let isLoading = loading.models.role,

全局监听所有异步请求

let isAllLoading = loading.global()

在异步请求是loading变量会为true，完成后会变成false，用来控制加载动画