解决请求不断发送

src/app/basicVersion/exampleShow/ExampleDetail.js

@@ -27,14 +27,16 @@ class ExampleDetail extends Component {
             domain: '',
 
             cloudName: 'tencent',
-            cloudID: '',
-            secretID: '',
-            secretKey: '',
-            appId: '',
 
             customName: '',
             bucketName: '',
             dbKind: 'fc-db', // mongodb fc-db
+        };
+        this.cloudState = {
+            cloudID: '',
+            secretID: '',
+            secretKey: '',
+            appId: ''
         }
     }
 
@@ -97,6 +99,7 @@ class ExampleDetail extends Component {
         this._isMounted = true;
         let _this = this;
         let {userID, dbKind, bucketName, customName} = this.state;
+        let {cloudID} = this.cloudState;
 
         if (bucketName === '') {
             console.log('state, 没有传值');
@@ -146,8 +149,6 @@ class ExampleDetail extends Component {
                         let {apiId, path, method} = apiData;
                         let {serviceName, serviceId, subDomain} = serviceData;
 
-                        let {userID, cloudID} = _this.state;
-
                         let pathVarObj = {
                             id: idGen('path'),
                             user_id: userID,
@@ -258,16 +259,17 @@ class ExampleDetail extends Component {
     };
 
     getCloudDetail = (cloudID, secretID, secretKey, appId) => {
-        this.setState({
+        this.cloudState = {
             cloudID,
             secretID,
             secretKey,
             appId
-        })
+        }
     };
 
     render() {
-        let {userID, disableDeployButton, appId, secretID, secretKey, bucketName, dbKind, domain, showCustom, cloudName, check} = this.state;
+        let {userID, disableDeployButton, bucketName, dbKind, domain, showCustom, cloudName, check} = this.state;
+        let {appId, secretID, secretKey} = this.cloudState;
         return (
             <div className={'deploy-choose-cloud'}>
                 <Layout style={{padding: '24px', minHeight: '300px'}}>
@@ -337,18 +339,27 @@ class ExampleDetail extends Component {
                                         </div>
                                         <div style={{marginTop: 20}}>
                                             <div className={'schema-name'}><FormattedMessage id='Cloud Setting'/></div>
-                                            <RadioGroup onChange={(e) => {
-                                                this.setState({cloudName: e.target.value})
-                                            }} value={this.state.cloudName}>
+                                            <RadioGroup
+                                                onChange={(e) => {
+                                                    this.setState({cloudName: e.target.value})
+                                                }}
+                                                value={this.state.cloudName}
+                                            >
                                                 <Radio value={'tencent'}><FormattedMessage id='tencent cloud'/></Radio>
                                                 <Radio value={'aliyun'}><FormattedMessage id='aliyun'/></Radio>
                                                 <Radio value={'amazon'}><FormattedMessage id='amazon cloud'/></Radio>
-                                            </RadioGroup>
-                                            <CloudQueryAndConfig cloudName={cloudName} userID={userID}
-                                                                 getCloudDetail={this.getCloudDetail} check={check}
-                                                                 reCheck={() => {
-                                                                     this.setState({check: check+1})
-                                                                 }}/>
+                                            </RadioGroup>;
+                                            {/*
+                                                该处设置 check 属性，就是为了：当点击取消后，能够再次查询
+                                             */}
+                                            <CloudQueryAndConfig
+                                                userID={userID}
+                                                getCloudDetail={this.getCloudDetail}
+                                                cloudName={cloudName}
+                                                check={check}
+                                                reCheck={() => {
+                                                    this.setState({check: check + 1})
+                                                }}/>
                                         </div>
                                         <div style={{marginTop: 20}}>
                                             <div className={'schema-name'}><FormattedMessage id='DB Choose'/></div>