el-table 表格序号列前端实现递增,切换分页不从头开始

news2025/1/8 6:06:29

06dc70f0d8b54aebb7b447585bb0734f.png

   af28c1223492407898115cefb88a4af0.png

<el-table-column type="index" width="55" label="序号" :index="hIndex">

      </el-table-column>

分页

 <el-pagination

      @size-change="handleSizeChange" @current-change="handleCurrentChange">

    </el-pagination>

data中: 

   pageObj: {

        pagesize: 10,

        currpage: 1,

        pageIndexCopy: 1,

      },

 

方法中:

 hIndex(index) {

      // 当前页数 - 1 * 每页数据条数 + index + 1 ( index 是索引值,从0开始)

      return (this.pageObj.pageIndexCopy - 1) * this.pageObj.pagesize + index + 1

    },

  handleCurrentChange(val) {

      this.pageObj.currpage = val

      this.pageObj.pageIndexCopy = val

    },

其实正常后端也可以直接返回,前台就不用做这些了

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1969462.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【Linux】动态库|静态库|创建使用|动态库加载过程

目录 ​编辑 前言 静态库 为什么要使用库(形成原理 ) 生成一个静态库 静态库的使用 动态库 生成一个动态库 动态库的使用 解决方法 动态库加载过程 ​编辑 前言 库&#xff08;Library&#xff09;是一种方式&#xff0c;可以将代码打包成可重用的格式&#xff08;站…

OrionX:革新GPU资源管理,助力AI开发团队高效运作

您的AI开发团队是否经常陷入这样的窘境&#xff1a; 人多卡少&#xff0c;GPU资源难以满足每个成员的需求&#xff1f; 当开发环境中需要变更GPU卡配置时&#xff0c;流程繁琐不堪&#xff0c;不得不关闭容器、重新配置再重启&#xff1f; 是否曾因GPU卡分配后未被充分利用而…

简单好用的DX修复工具下载|修复丢失损坏的DLL文件

DirectX是被广泛运用于游戏和多媒体应用程序的一种重要组件&#xff0c;它可以提供优良的视觉效果和音频体验。很多用户在使用计算机时或多或少会遇到因为DirectX缺失而导致相关问题。例如&#xff1a;系统故障、图形渲染错误、音频失真等问题。 今天小编将深入浅出地为大家讲…

在循环语句里面element重复提示最后一条的解决办法

做项目时遇到了个问题&#xff0c;要求把时间重叠的每个阶段都提示出来 但是发现$message的提示框不仅都重合在一起 并且数据内容只是最后一次循环出来的信息如下图 首先解决样式重合问题 这里我就用的是简单粗暴的方法加个定时器 这样重合问题就可以解决其次是提示内容只是最后…

删除分区 全局索引 drop partition global index Statistics变化

1.不一定unusable&#xff0c;可以先删除data (index 再删除过程中会更新结构)再drop/truncate. ---------------------- CREATE TABLE interval_sale ( prod_id NUMBER(6) , cust_id NUMBER , time_id DATE ) PARTITION BY RANGE (time_i…

前端面试宝典【HTML篇】【4】

欢迎来到《前端面试宝典》,这里是你通往互联网大厂的专属通道,专为渴望在前端领域大放异彩的你量身定制。通过本专栏的学习,无论是一线大厂还是初创企业的面试,都能自信满满地展现你的实力。 核心特色: 独家实战案例:每一期专栏都将深入剖析真实的前端面试案例,从基础知…

C++回顾——虚析构

一、示例代码 #include<iostream> using namespace std;class Weapon { public:virtual void getWeapon() 0;//virtual ~Weapon() default; };class bow :public Weapon { public:void getWeapon() override{cout << "弓箭 " << ends;}~bow(){c…

支持对接OpenAI、Ollama和本地向量模型,MaxKB开源知识库问答系统发布v1.4.0版本

2024年8月1日&#xff0c;MaxKB开源知识库问答系统正式发布v1.4.0版本。在这一版本中&#xff0c;MaxKB的社区版支持对接OpenAI、Ollama和本地的向量模型&#xff0c;并且支持设置模型的使用权限&#xff0c;同时MaxKB还支持知识库自定义向量模型。 自v1.4.0版本开始&#xff…

坐牢第二十一天 20240801(IO)

一.作业 1、使用两个线程完成两个文件的拷贝&#xff0c;分支线程1拷贝前一半&#xff0c;分支线程2拷贝后一半&#xff0c;主线程回收两个分支线程的资源 #include <myhead.h> struct Node {char *src;char *dest;int start;int len; }; //定义求源文件大小的函数 int…

python爬虫初识

一、什么互联网 互联网&#xff08;Internet&#xff09;是全球范围内最大的计算机网络&#xff0c;它将数以百万计的私人、公共、学术、商业和政府网络通过一系列标准通信协议&#xff08;如TCP/IP&#xff09;连接起来形成的一个庞大的国际网络。 互联网的起源可以追溯到196…

【C++】1.C++入门(1)

文章目录 1.C关键字2.命名空间2.1 命名空间定义2.2 命名空间使用 3.C输入&输出4.缺省参数4.1 缺省参数概念4.2 缺省参数分类 5.函数重载5.1 函数重载概念5.2 C支持函数重载的原理--名字修饰(name Mangling) 1.C关键字 C总计63个关键字&#xff0c;C语言32个关键字 2.命名空…

0206创建场景状态的基础接口

一、创建一个类 二、写一个类&#xff0c;作为接口类的作用&#xff08;不一定是interface&#xff09;

ctfshow 大赛原题 web689--web695

web689 <?php error_reporting(0); if(isset($_GET) && !empty($_GET)){$url $_GET[file];$path "upload/".$_GET[path];}else{show_source(__FILE__);exit(); }if(strpos($path,..) > -1){ //检查 $path 是否包含 ..&#xff0c;以防止路径注…

Podman 发布 v5.2.0-RC3

这是 v5.2.0 的最终候选版本。以下是初步的发布说明。 功能 Podman 现在支持使用 libkrun 作为在 MacOS 上创建虚拟机的后端。libkrun 后端的优势在于允许将 GPU 挂载到虚拟机中以加速任务。默认后端仍然是 applehv。Quadlet 现在支持.build 文件&#xff0c;这使得可以由 Quad…

2024PDF编辑工具新趋势:从基础到高级的全方位方案

随着数字化办公的发展&#xff0c;我们对PDF编辑的需求也日益增长。从最开始对文字的修改到现在可以插入音频、视频文件。这些都离不开PDF编辑软件的功劳&#xff0c;那有什么好用的PDF编辑工具呢&#xff0c;听我娓娓道来。 1.福昕PDF编辑器 直达链接&#xff1a;https://e…

【轨物方案】分布式光伏电站运维智能化升级方案

分布式光伏电站从2010年开始在国内推广&#xff0c;到2022年底&#xff0c;全国工商业分布式光伏电站装机容量为157.62GW&#xff0c;并且新增装机量逐年递增。以1MW/电站计算&#xff0c;保守估计全国至少已有十几万个工商业分布式光伏电站。 这些电站的运维工作是往往交给专业…

百度松果菁英班作业整理(第一期)

本期的题目比较简单&#xff0c;最后两题稍微复杂&#xff0c;但是主题思路也不难&#xff0c;大家可以一起练习。 孪生质数 在质数中&#xff0c;若两个质数之差为2,我们称之为孪生质数,例如(3、5)(5、7)&#xff0c;输入2个正整数&#xff0c;判断他是不是孪生质数,输出YE…

大数据技术原理-MapReduce的应用

摘要 本实验报告详细阐述了在“大数据技术原理”课程中进行的MapReduce编程实验。实验环境基于Hadoop平台和Ubuntu操作系统。实验的核心内容包括使用MapReduce编程模型实现文件的合并去重、排序以及对给定表格信息的挖掘。实验过程中&#xff0c;我们首先在Hadoop分布式文件系…

基于统计检验与随机森林分析不同天气类型的影响因素

1.项目背景 本项目使用了一个人工合成的天气数据集&#xff0c;模拟了雨天、晴天、多云和雪天四种类型&#xff0c;在分析过程中&#xff0c;对数据进行了异常值处理&#xff0c;并通过描述性统计对数据进行了初步探索&#xff0c;接着&#xff0c;使用Kruskal-Wallis检验、Du…