element 分页切换时:current-page无效 页数不会跟着一起切换

问题回溯:使用el-pagination组件 选择切换当前分页 页数为2

在这里插入图片描述

问题结果:el-pagination组件 当前页切换失败 一直都是 1,接口传参分页数据是2,打印当前分页也是2

解决方案1:使用 current-page参数 .sync 修饰符

在这里插入图片描述

在这里插入图片描述

解决方案2:检查获取表格方法的时候 取消手动设置 total = 0

在这里插入图片描述
例子:

 <el-table
      :data="tableData"
      style="width: 100%">
      <el-table-column prop="date" label="日期" width="180"></el-table-column>
</el-table>

<el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="page.current"
      :page-sizes="[100, 200, 300, 400]"
      :page-size="page.size"
      layout="total, sizes, prev, pager, next, jumper"
      :total="page.total">
</el-pagination>

tableData:[]  
page:{
	current:1,
	size:10,
	total:0
}

//获取表格参数
getTable(){
this.tableData = []
this.page.total = 0  //这一步会重新赋值 total,导致current-page页数异常 一直都会是 1,使用.sync也无效
	
//接口调用
//接口调用成功 赋值
this.tableData = res.data || []
this.page.total = res.total || 0
}

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

服务器数据恢复—Storwize V3700存储数据恢复案例

服务器存储数据恢复环境&#xff1a; 某品牌Storwize V3700存储&#xff0c;10块硬盘组建了2组Mdisk加入到一个存储池中&#xff0c;一共创建了1个通用卷来存放数据&#xff0c;主要数据为oracle数据库。 服务器存储故障&#xff1a; 其中一组Mdisk中两块磁盘出现故障离线&…

PDF 书签制作与调整 从可编辑、不可编辑 PDF 文档创建书签的方法

本文是对以前发表的旧文拆分&#xff0c;因为原文主题太多&#xff0c;过长&#xff0c;特另起一篇分述。 第一部分 由可编辑 PDF 文档创建书签 方法 1. Adobe Acrobat Pro autobookmark AutoBookmark 是一个可用于 Adobe Acrobat 自动生成书签的插件。 官方下载地址&…

c语言指针的应用场景

​ 1.什么是指针&#xff1f; 当我们提起指针的时候&#xff0c;可能第一反应会露出惊喜的表情 &#xff08;但是我们其实没必要那么慌&#xff0c;因为当我们随着我们学习的越来越深入就会发现&#xff0c;指针虽然看起来难&#xff0c;实际上也不怎么简单。哈哈哈开玩笑的&a…

Vitis HLS 学习笔记--Syn Report解读(1)

目录 1. 介绍 2. 示例一 2.1 HLS 代码 2.2 Report 解读 2.2.1 General Information 2.2.2 Timing Estimate 2.2.3 Performance & Resource Estimates 2.2.4 HW interfaces 2.2.4.1 硬件接口报告 2.2.4.2 导出至 Vivado 中的 IP 2.2.4.3 Port-Level Protocols 端…

如何安全进行速卖通自养号测评操作?

对于新加入的卖家而言&#xff0c;进行销量测评显得尤为关键。速卖通平台上的新店往往难以获得活动的扶持&#xff0c;且初始流量相当有限。因此&#xff0c;开店的首要任务便是积极展开测评工作&#xff0c;努力积累初始的评论和销售记录。测评的益处颇为显著&#xff0c;它不…

【Redis 开发】Redisson

Redisson RedissonRedisson分布式锁Redisson可重入锁Redission解决超时释放的问题Redission解决锁的判断一次性问题Redission分布式锁主从一致性问题 Redisson Redisson是一个在Redis的基础上实现的java驻内存数据网格&#xff0c;就是提供了一系列的分布式的java对象 官方地址…

嵌入式学习Day19

输入一个数字&#xff0c;实现数字的逆置&#xff0c;不使用字符串截取的方式 代码&#xff1a; #&#xff01;/bin/bash echo number reverse read -p "please number:" num t0 while [ $num -ne 0 ] dot$((t*10num%10))((num/10)) done echo $t运行结果&#xff…

机器人系统ros2-开发实践03-监听节点的参数变化(C++)

背景&#xff1a; 通常&#xff0c;节点需要响应其自身参数或另一个节点参数的更改。 ParameterEventHandler 类可以轻松侦听参数更改&#xff0c;以便您的代码可以响应它们。本教程将向您展示如何使用 ParameterEventHandler 类的 C 版本来监视节点自身参数的更改以及另一个节…

el-table-column 表格列自适应宽度的组件封装说明

针对组件业务上的需求&#xff0c;需要给 el-table-column 加上限制&#xff0c;需保证表头在一行展示&#xff0c;部分列的内容要一行展示&#xff0c;自适应单项列的宽度&#xff1b; 1、先计算数据渲染后的 el-table-column 文本宽度&#xff1b; 因列表的有些数据需要做到…

MVP+敏捷开发

MVP敏捷开发 1. 什么是敏捷开发&#xff1f; 敏捷开发是一种软件开发方法论&#xff0c;旨在通过迭代、自组织的团队和持续反馈&#xff0c;快速响应需求变化并交付高质量的软件。相较于传统的瀑布模型&#xff0c;敏捷开发强调灵活性、适应性和与客户的紧密合作。敏捷开发方…

RestfulApi RestTemplate代码规范介绍

1.介绍 1.1 RestfulApi Restful API 是一种设计风格&#xff0c;代表了使用 HTTP 协议构建 web 服务的一种架构原则。REST&#xff08;Representational State Transfer&#xff09;的核心思想是&#xff0c;通过 URL 定位资源&#xff0c;使用 HTTP 方法&#xff08;GET, POS…

Kafka 3.x.x 入门到精通(06)——Kafka进阶

Kafka 3.x.x 入门到精通&#xff08;06&#xff09;&#x1f449;&#x1f449;&#x1f449;&#x1f449; Kafka进阶 3. Kafka进阶3.1 Controller选举3.2 Broker上线下线3.3 数据偏移量定位3.4 Topic删除3.5 日志清理和压缩3.7 页缓存3.8 零拷贝3.9 顺写日志3.10 Linux集群部…

12 c++版本的坦克大战

前言 呵呵 这大概是 大学里面的 c 贪吃蛇了吧 有一些 面向对象的理解, 但是不多 这里 具体的实现 就不赘述, 仅仅是 发一下代码 以及 具体的使用 坦克大战 #include<iostream> #include<windows.h> #include<conio.h> #include<ctime> #include…

基于FastGPT搭建知识库问答系统

什么是 FastGPT &#xff1f; FastGPT 是一个基于 LLM 大语言模型的知识库问答系统&#xff0c;提供开箱即用的数据处理、模型调用等能力。同时可以通过 Flow 可视化进行工作流编排&#xff0c;从而实现复杂的问答场景&#xff01; FastGPT 允许用户构建本地知识库&#xff0c;…

C# APS.NET CORE 6.0 WebApi在IIS部署报错

今天尝试着把基于 APS.NET CORE6.0开发的webAPI程序部署到IIS中&#xff0c;当打开网站地址时报错&#xff0c;无法打开&#xff0c;于是查找资料最终进行了解决。 打开 IIS →模块 查看列表中是否存在 AspNetCoreModuleV2&#xff0c;如下&#xff1a; 对应的应用池需要选择“…

node.js egg.js

Egg 是 Node.js 社区广泛使用的框架&#xff0c;简洁且扩展性强&#xff0c;按照固定约定进行开发&#xff0c;低协作成本。 在Egg.js框架中&#xff0c;ctx 是一个非常核心且常用的对象&#xff0c;全称为 Context&#xff0c;它代表了当前 HTTP 请求的上下文。ctx 对象封装了…

施耐德 Unity Pro 编程软件导入导出变量

适用范围 施耐德中高端PLC&#xff0c;使用的编程软件为 UnityPro &#xff08;最新版更名为 Ecostructure Control Expert&#xff09; 中端 PLC&#xff1a;Premium&#xff0c;M340高端 PLC&#xff1a;Quantum&#xff0c;M580 导出/导入变量 导出变量可导出【变量和 FB…

JavaScript进阶(十五):JS 垃圾回收机制_vue gc

内存&#xff1a;由可读写单元组成&#xff0c;表示一片可操作空间&#xff1b;管理&#xff1a;人为的去操作一片空间的申请、使用和释放&#xff1b;内存管理&#xff1a;开发者主动申请空间、使用空间、释放空间&#xff1b;管理流程&#xff1a;申请-使用-释放&#xff1b;…

社交巨头与去中心化:解析Facebook在区块链的角色

在数字化时代&#xff0c;社交媒体已经成为人们日常生活中不可或缺的一部分。作为全球最大的社交媒体平台&#xff0c;Facebook 在社交领域的影响力无可置疑。然而&#xff0c;随着区块链技术的崛起&#xff0c;Facebook 也开始探索如何将这一技术应用于其平台&#xff0c;以适…

基于LSTM算法实现交通流量预测(Pytorch版)

算法介绍 LSTM&#xff08;Long Short-Term Memory&#xff09;算法是一种特殊设计的循环神经网络&#xff08;RNN, Recurrent Neural Network&#xff09;&#xff0c;专为有效地处理和建模序列数据中的长期依赖关系而开发。由于传统RNN在处理长序列时容易遇到梯度消失和梯度…