Geeker-Admin中ProTable表格分页之自定义接口页码、尺寸参数

news/2024/7/10 2:49:44 标签: vue.js, javascript, vue, 前端, elementui

最近挖了个新玩意儿,Geeker-Admin,看起来感觉挺好。

鼓捣了半天搞定了与服务端的API接口对接,但在表格分页的时候又遇到了问题,系统默认是pageNum/pageSize这两个参数名用来分页,而服务端是current/size,开始被注释误导,跑去修改组件,但又想起用到的接口来自多台不同的服务器,可能出现分页参数不同的情况。

在折腾的过程中,发现示例文件中有对日期参数做出过处理,而且也是我惯用的做法:

javascript">// 如果你想在请求之前对当前请求参数做一些操作,可以自定义如下函数:params 为当前所有的请求参数(包括分页),最后返回请求列表接口
// 默认不做操作就直接在 ProTable 组件上绑定	:requestApi="getUserList"
const getTableList = (params: any) => {
  let newParams = JSON.parse(JSON.stringify(params));
  newParams.createTime && (newParams.startTime = newParams.createTime[0]);
  newParams.createTime && (newParams.endTime = newParams.createTime[1]);
  delete newParams.createTime;
  return getUserList(newParams);
};

这种对日期组件返回数组值进行二次处理的方式,我也经常用,于是尝试在getTableList里添加自己的分页参数。

javascript">// 如果你想在请求之前对当前请求参数做一些操作,可以自定义如下函数:params 为当前所有的请求参数(包括分页),最后返回请求列表接口
// 默认不做操作就直接在 ProTable 组件上绑定	:requestApi="getUserList"
const getTableList = (params: any) => {
  let newParams = JSON.parse(JSON.stringify(params));
  newParams.createTime && (newParams.startTime = newParams.createTime[0]);
  newParams.createTime && (newParams.endTime = newParams.createTime[1]);
  delete newParams.createTime;

  //增加我自己的分页参数current/size,然后再删除默认的pageSize/pageNum,问题完美解决。
  newParams.current = newParams.pageNum
  newParams.size = newParams.pageSize
  delete newParams.pageNum
  delete newParams.pageSize
  return getUserList(newParams);
};


http://www.niftyadmin.cn/n/5131961.html

相关文章

面试经典150题——Day24

文章目录 一、题目二、题解 一、题目 68. Text Justification Given an array of strings words and a width maxWidth, format the text such that each line has exactly maxWidth characters and is fully (left and right) justified. You should pack your words in a …

用于读取验证码的 OCR 模型

介绍 此示例演示了使用功能 API 构建的简单 OCR 模型。除了结合 CNN 和 RNN 之外,它还说明了如何实例化新层并将其用作“端点层”来实现 CTC 损失。 设置 import os import numpy as np import matplotlib.pyplot as pltfrom pathlib import Path from collections import Co…

C#,数值计算——分类与推理,基座向量机的 Svmgenkernel的计算方法与源程序

1 文本格式 using System; namespace Legalsoft.Truffer { public abstract class Svmgenkernel { public int m { get; set; } public int kcalls { get; set; } public double[,] ker { get; set; } public double[] y { get; set…

nrf52832 开发板入手笔记:J-Flash 蓝牙协议栈烧写

前言 nrf52832 想要开启 蓝牙功能,比如蓝牙主从机功能,需要额外烧写 蓝牙协议栈的固件:softdevice,换句话说,蓝牙协议栈等代码是不开放的,只提供一个 二进制文件。 也就是 nrf52832 Flash 与 RAM 要分区了…

08.K8S高可用方案

K8S高可用方案 1、高可用部署方式 官方提供两种高可用实现方式: 堆叠etcd 拓扑,其中 etcd 节点与控制平面节点共存;外部 etcd 节点,其中 etcd 与控制平面在不同的节点上运行;1.1、堆叠 etcd 拓扑 主要特点: 每个 master 节点上运行一个 apiserver 和 etcd, etcd 只与本…

中微爱芯74逻辑兼容替代TI/ON/NXP工规品质型号全

这里写自定义目录标题 工业级型号全产品线概述![在这里插入图片描述](https://img-blog.csdnimg.cn/097ef810b2234f07b0c0c1e962a73761.png)批量应用行业头部客户兼容替代封装对照逻辑参数对比电平转换系列型号对照HC/HCT 系列型号对照AHC/AHCT 系列型号对照LV/LVC 系列型号对照…

Android14 WMS启动流程

一 概述 本文Android14源代码可参考:Search 在 Android 系统中,从设计的角度来看,窗口管理系统是基于 C/S 模式的。整个窗口系统分为服务端和客户端两大部分,客户端负责请求创建窗口和使用窗口,服务端完成窗口的维护…

机器学习(五)如何理解机器学习三要素

1.8如何理解机器学习三要素 统计学习模型策略算法 模型:规律yaxb 策略:什么样的模型是好的模型?损失函数 算法:如何高效找到最优参数,模型中的参数a和b 1.8.1模型 机器学习中,首先要考虑学习什么样的…