this.setState设置数据状态时进入死循环一直在执行方法请求


一个修改功能,点击确定调用回调函数往后台发请求,因为想加一个确定按钮的loading效果

原来的代码

//模态框确认点击事件,修改子页面props valid状态,触发子页面执行回调
    handleModalOk() {
        this.setState({
            modelIsValid: true,
        }, () => {
            this.setState({
                modelIsValid: false,
            });
        });
    }
//修改模态框子页面回调
    callbackValid(oprType, errors, data) {
        const obj = this;
        if (!!errors) {
            return;
        }else if(data.reference_id == undefined){
            openNotice('error', '请先选择代理商');
            return;
        }else {
            obj.handleEditSubmit(data);
            
        }
    }

这个时候控制loading效果的confirmLoading状态值还是初始的false

第一次修改后的代码

//模态框确认点击事件,修改子页面props valid状态,触发子页面执行回调
    handleModalOk() {
        this.setState({
            modelIsValid: true,
        }, () => {
            this.setState({
                modelIsValid: false,
            });
        });
    }
//修改模态框子页面回调
    callbackValid(oprType, errors, data) {
        const obj = this;
        if (!!errors) {
            return;
        }else if(data.reference_id == undefined){
            openNotice('error', '请先选择代理商');
            return;
        }else {
            this.state.formData = {};
            this.setState({
                formData: Object.assign({}, this.state.formData, filterObject(data)),
                formReset: false,
                confirmLoading: true,
              }, () => {
                obj.handleEditSubmit();
            }); 
            
        }
    }

这个时候就会陷入死循环,一直调用请求接口handleEditSubmit,最后经过很久的查找,终于改好了

//模态框确认点击事件,修改子页面props valid状态,触发子页面执行回调
    handleModalOk() {
        this.setState({ modelIsValid: true, });
    }
//修改模态框子页面回调
    callbackValid(oprType, errors, data) {
        this.setState({ modelIsValid: false, });
        const obj = this;
        if (!!errors) {
            return;
        }else if(data.reference_id == undefined){
            openNotice('error', '请先选择代理商');
            return;
        }else {
            this.state.formData = {};
            this.setState({
                formData: Object.assign({}, this.state.formData, filterObject(data)),
                formReset: false,
                confirmLoading: true,
              }, () => {
                obj.handleEditSubmit();
            });           
        }
    }

这样写才是正确的


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM