如何用JS在页面中多次调用同一API获取全量数据？

你的现有代码仅能单次获取最多400条数据，要获取全量4000条数据，需通过分页请求循环调用API，以下是适配后的实现方案：

核心思路 #

1. 首次请求时获取总数据条数，计算所需的总请求页数（按每页400条计算）
2. 循环发起分页请求，逐页累加数据到全局数组
3. 所有请求完成后再初始化Autocomplete组件，确保搜索时使用全量数据

修改后的完整代码 #

var eventList = [];
var totalPages = 0;
var currentPage = 1;
const PAGE_SIZE = 400; // API单次最大返回条数

// 封装分页获取数据的函数
var getEventsByPage = function(page) {
  system123.api.request({
    api: 'apiName',
    data: {
      methods: '', // 保留原业务参数
      page: page,
      pageSize: PAGE_SIZE
    },
    callback: {
      success: function(response) {
        const res = response.getTeameventsResponse;
        if (res.totalNumberResults === "0") {
          console.log("无数据");
          return;
        }
        // 第一次请求时计算总页数
        if (currentPage === 1) {
          totalPages = Math.ceil(parseInt(res.totalNumberResults) / PAGE_SIZE);
        }
        // 累加当前页的数据
        const events = system123.utils.ensureArray(res.teamevent);
        events.forEach(event => {
          eventList.push(event.name);
        });
        // 继续请求下一页，直到所有页请求完成
        currentPage++;
        if (currentPage <= totalPages) {
          getEventsByPage(currentPage);
        } else {
          // 全量数据加载完成后初始化Autocomplete
          initAutocomplete();
          console.log("全量数据加载完成，共" + eventList.length + "条");
        }
      },
      error: function(response) {
        console.log("请求出错：" + response.errorResponse.message);
      }
    }
  });
};

// 初始化Autocomplete组件
var initAutocomplete = function() {
  $("#eventName").autocomplete({
    source: function(request, response) {
      var matcher = new RegExp("^" + $.ui.autocomplete.escapeRegex(request.term), "i");
      response($.grep(eventList, function(item) {
        return matcher.test(item);
      }));
    }
  });
};

// 页面加载完成后启动全量数据加载
$(function() {
  getEventsByPage(1);
});

关键说明 #

• 需确认你的API支持page（页码）和pageSize（每页条数）参数，若参数名不同，直接修改data中的对应字段即可
• 采用递归方式逐页请求，避免异步请求导致的数据顺序混乱
• 等待全量数据加载完成后再初始化组件，防止用户搜索到不完整的结果
• 若API允许并行请求，可改用Promise.all批量发起请求提升加载速度，但需注意不要触发API频率限制

内容的提问来源于stack exchange，提问作者KyleD