umi + dva 应用框架中yield串行接口调用填坑（二）

在看本文之前先回顾下

umi + dva 应用框架中yield串行接口调用填坑（一）

本文提供第三种接口优化的方法

R3:将getCompares 异步方法拆分为多个异步方法，耗时1s / 2s / 10s，每个异步返回结果后会直接改变state，缩短了页面看到所有内容时间

effects: {
    *getCompares({ params, onSuccess }: any, { call, put }: any): any {
        yield put({ type: 'addData', data: { loading: true } });
        let data = [];
        let brands = [];
        let date = [];
        [data, brands, date] = yield [call(api.getContent, params), call(api.getBrands, params), call(api.getDate)];
        yield put({
            type: 'addData',
            data: { data, brands, date, loading: false }
        });
    },
    *getPlatform({ params, onSuccess }: any, { call, put }: any): any {
        yield put({ type: 'addData', data: { loading: true } });
        let angle = [];
        let brand = [];
        let platform = [];
        [angle, brand, platform] = yield [call(api.dictAngle, call(api.dictBrand)), call(api.dictPlatform)];
        yield put({
            type: 'addData',
            data: { angle, brand, platform }
        });
    },
    *getProvince({ params, onSuccess }: any, { call, put }: any): any {
        yield put({ type: 'addData', data: { loading: true } });
        let province = [];
        let site = [];
        let segment = [];
        [province, site, segment] = yield [call(api.dictProvince), call(api.dictSite), call(api.dictSegment)];
        yield put({
            type: 'addData',
            data: { province, site, segment }
        });
    }
},

R4: 可以将每个异步请求里面的yield合并请求全部拆分为异步请求