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