ReactJS加载有状态数据、优化

Question

我对ReactJS很陌生，并将它与Django Rest框架(DRF)结合使用。

def MyModel(model):
    ...
    status = ChoiceField(['new', 'in progress', 'completed'...])

在我的应用程序中，我对每个州都有单独的部分。所以数据需要分开。我的问题是，有很多不同的州，大约6或7个州。

所以我对每一种状态都使用了不同的路线。/new，/inprogress等，但是这会导致每次大约7次请求，而不是仅仅1次。

loadMymodelsFromServer: function () {
    this.loadNewMymodelsFromServer();
    this.loadAssignedMymodelsFromServer();
    this.loadAllocatedMymodelsFromServer();
    this.loadDraftMymodelsFromServer();
    this.loadPublishedMymodelsFromServer();
    this.loadArchivedMymodelsFromServer()
    this.loadSponsoredMymodelsFromServer();
    this.loadCurrentUserMymodelsFromServer();
},

loadNewMymodelsFromServer: function() {
    var url = this.props.url + "/new/";
    $.ajax({
        url: url,
        dataType: 'json',
        cache: false,
        success: (function (data) {
            this.setState({ new_mymodels: data });
        }).bind(this),
        error: (function (xhr, status, err) {
            console.error(url, status, err.toString());
        }).bind(this)
    });
},

数据必须刷新几次，比如删除操作和更新操作，因为JS数组不支持这些操作。

在一个巨大的请求中加载所有未排序的数据，并在JS for循环中对其进行排序，会更好吗？

我知道数据库被优化以查询这样的参数，而不是Javascript，所以我做错了什么？

Answer 1

与其有7个单独的ajax调用，不如只进行一个ajax调用，将所有7个结果作为一个对象返回。

新ajax调用的服务器处理程序只需调用其他7个查询，并将结果收集到一个对象中。

下面是服务器的一些伪代码：

function megaQueryHandler() {
    var result = {
       query1Data: query1Handler(),
       query2Data: query2Handler(),
       ...
    };

    return result;
}

然后，您的客户只需对这个“超级查询”进行一次调用即可。