• umi react处理接口请求慢的问题


    // 处理首页接口慢的问题
    function handleLongReq(arr, types, that, time) {
        const { dispatch } = that.props;
        const res = arr.map(item => {
            item.data = that.props[item.model][item.key]
            return item
        });
        if (window.time === 0 || window.time === undefined) {
            arr.map(item => {
                const { key, effect, model } = item;
                types.push(effect);
                const data = that.props[model][key];
                if (data instanceof Array) {
                    data.length !== 0 && dispatch({
                        type: model + "/resetData",
                        payload: {
                            data: []
                        },
                        keyName: key
                    })
                } else if (data instanceof Object) {
                    Object.keys(data).length !== 0 &&
                        dispatch({
                            type: model + "/resetData",
                            payload: {
                                data: {}
                            },
                            keyName: key
                        })
    
                }
            })
            window.time = time;
            window.homeInterval = setInterval(() => {
                window.time--;
                if (window.time === 0) {
                    clearInterval(window.homeInterval)
                }
            }, 1000)
        } else {
            res.map(obj => {
                const { data, effect } = obj;
                if (data instanceof Array) {
                    data.length === 0 ? types.push(effect) : del(types, effect)
                } else if (data instanceof Object) {
                    Object.keys(statisticData).length === 0 ? types.push(effect) : del(types, effect)
                }
            })
        }
    
        function del(types, effect) {
            const index = types.findIndex(item => item === effect);
            types.splice(index, 1);
        }
    }
    
    //调用 要在 componentDidMount生命周期里
            
            const arr = [
                {
                    key: 'sysTrend',
                    effect: 'home/getSysTrend',
                    model: 'home'
                },
                {
                    key: 'statisticData',
                    effect: 'home/getStatisticData',
                    model: 'home'
                }
            ]
    
            handleLongReq(arr, types, this, 30);
    //types是页面需要请求的所有effects ,默认不包含arr中的effects, 30表示定时器的时间
    
    
    • 注意:相关的model里要有重置此props数据的effect。
  • 相关阅读:
    概率论基础学习笔记
    树点涂色
    2016北京集训测试赛(八)Problem C: 直径
    BZOJ 4361 ISN
    2017省选集训测试赛(二十五)Problem B recollection
    2016北京集训测试赛(六)Problem B: 矩阵
    记录Vue和Jquery混合开发中关于点击事件的一个bug
    记录JQ-WEUI中滚动加载的一个BUG
    Vue Elementui 如何让输入框每次自动聚焦
    什么是CDN加速?(转载)
  • 原文地址:https://www.cnblogs.com/chengyunshen/p/12852517.html
Copyright © 2020-2023  润新知