reactjs - 如何等待大量的 REST API 调用完成？

Question

我需要建立一个数据表，除了普通字段外，每一行都有自己的规则。对于插图：

构建行时，我手头没有所有数据，因此在构建每个行时，我需要为每个规则调用 getRule() 。

我所做的是：

this.data.forEach( (row) => {

            this.sortedRules = row.Rules.sort(function(a, b){
                a = a.Name.toLowerCase()
                b = b.Name.toLowerCase()
                if(a < b) { return -1; }
                if(a > b) { return 1; }
                return 0;
            })

            this.sortedRules.map ( rule => {
                ruleSpecEditor.isRuleEnabled(rule.Id, this.userSessionId).then( (enabled) => {
                    this.setState({
                        [rule.Name+"_Enabled"]: enabled
                    })
                })

                // Promise.all(ruleEditor.getRule(rule.Id, this.userSessionId)).then( (ruleStruct) => {
                ruleEditor.getRule(rule.Id, this.userSessionId).then( (ruleStruct) => {

                    this.setState({
                        [rule.Name+"_Valid"]: ruleStruct.Valid,
                        [rule.Name+"_ErrorDescription"]: ruleStruct.ErrorDescription
                    }, () => {
                        this.buildSingleRule(row)
                    })

                }) //getRule call
            }) //sorted rules map

            this.buildRow(row)

            // console.log("Json: ", jsonData)
            rows.push(this.jsonData);
        }) //foreach rows loop

      this.setState({rows: rows})

在这种情况下，由于异步调用，我得到了行但没有规则的问题。我该如何处理？

标签： reactjs