开发指南133-设定列表分页的初始默认每页行数

el-pagination最核心的两个参数是：

page-sizes 可选每页行数

page-size   当前每页行数

page-sizes为写死的值，例如 [10,15,20,25,30]

page-size写死就不好，例如写10 对应大屏则表格下半部空白，小屏则出现滚动条，所以最好的办法是根据屏幕大小给默认值，尽可能一屏显示最多行且不滚动，算法如下：

第一步：

    //根据屏幕计算合适的行数
function calculateLimit() {
// 获取当前窗口高度
const windowHeight = window.innerHeight || document.documentElement.clientHeight;
// 计算可用高度（减去搜索区域高度、标题高度、底部高度）
const availableHeight = windowHeight - 144;
// 假设每条记录大约占40px高度，直接计算
return Math.floor(availableHeight / 40);
}

  这个值可能不在page-sizes里，需要从里面选择一个：

// 从limits数组中找到最接近目标值的数值（四舍五入原则）
function findClosestLimit(target, limits) {if (limits.length === 0) return target;let closest = limits[0];let minDiff = Math.abs(target - closest);for (let i = 1; i < limits.length; i++) {const current = limits[i];const diff = Math.abs(target - current);// 当差值更小时更新，或差值相等时取较大值（四舍五入原则）if (diff < minDiff || (diff === minDiff && current > closest)) {closest = current;minDiff = diff;}}return closest;
}

其中target是calculateLimit算出的合适值，limits是预定的分页选项数组，最终结果是数组中最合适的选项