首页 > 其他分享 >element-ui pagination分页组件 点击一次页面跳转触发两次current-change请求

element-ui pagination分页组件 点击一次页面跳转触发两次current-change请求

时间:2023-07-19 14:22:59浏览次数:28  
标签:触发 pagination element current 点击 跳转 total change 页面

在项目中使用element编写前端页面时,发现在使用pagination分页组件的时候,出现一个坑。

情况是每一次点击页面切换,都会重复触发两次页面切换current-change事件。无论是点击后面的页码或者是下一页或者是跳转到某个页面都会触发两次。第一次正常触发,第二次触发后会返回首页。

经过多次检查和测试,这个并非是自己写的逻辑错误或者是组件bug。其实第一次正常触发时返回的数据中total数据为0,导致的。

问题分析:

初始化pagination组件时total参数是正常的,点击其它页面后触发current-change事件,在对应绑定的事件中像后端请求数据,在返回的数据中,因为重置total,因为返回数据中的total数据为0,导致current-page从点击后的数据从新变为1,再次触发current-change事件。

所以记得检查返回的数据。

标签:触发,pagination,element,current,点击,跳转,total,change,页面
From: https://www.cnblogs.com/xiaolinye/p/17565454.html

相关文章

  • IOS开发-OC页面跳转传递参数
    使用OC进行IOS开发页面跳转传递参数的思路:1.在AppDelegate.h中定义一个可变词典2.在AppDelegate.m中初始化该可变词典3.向字典中添加要传递的参数4.在目标页面拿到参数 1.在AppDelegate.h中定义一个可变词典#import<UIKit/UIKit.h>@interfaceAppDelegate:UIRespo......
  • Element plus Carousel 修改指示器样式
    在Vue的<style>标签中,使用/deep/选择器是不推荐的,因为它已经被废弃了。取而代之的是使用>>>或::v-deep选择器来代替/deep/选择器。思路:通过::v-deep找到标签,通过伪类添加需要的样式: //滚动窗口底部的指示器.el-carousel::v-deep.el-carousel__indicators--outsidelibu......
  • vue-element-admin改为从后台拿动态路由
    改为从后台拿动态路由,大概如下步骤:1、后台增加接口,返回动态路由数据2、前端增加请求动态路由接口请求3、修改src/route/index.js去掉原有的动态路由,增加组件名和组件对象映射map4、修改src/store/modules/permission.js修改当前权限判断处理方法 generateRoutes一、后......
  • 54.使用VUE3+VITE+TYPESCRIPT+element-plus的setup语法糖,实现导出excel功能
    要实现导出Excel功能,你可以使用以下步骤:1.安装相关依赖:```bashnpminstallxlsxfile-saver```2.在你的组件中引入相关依赖:```javascriptimport{ref}from'vue';import{saveAs}from'file-saver';import{useTable}from'element-plus';importXLSX......
  • Element
    一、Element1.Element是饿了么团队研发的,一套为开发者、设计师和产品经理准备的基于Vue2.0桌面端组件库。2.组件组成网页的部件,例如超链接、按钮、图片、表格、表单、分页条等等。3.官网https://element.eleme.cn/#/zh_CNListener二、Element常见组件1.Table表格用于展示......
  • app直播源代码,element的select如何获取选中的对象
    app直播源代码,element的select如何获取选中的对象 <el-select     v-model="form.partnerShortName"      filterable     remote     placeholder="请输入关键词"     :remote-method="remoteMethod"     :loadi......
  • 若依登录超时默认跳转登录页
    问题若依登录超时,跳转/index页,但本项目中该页为空白页。解决因此,需要修改跳转为登录页。参考链接JavaScript---location.href的用法登录超时,返回到登录页面vue总结在js文件中跳转,除了引入router并使用router.push()之外,还可以直接location.href=url。方式一:......
  • ElementUI——日期范围选择得快捷选项
    前言element-ui的日期范围的快捷选项;内容pickerOptions:{shortcuts:[{text:'今天',onClick(picker){constend=newDate()conststart=newDate()picker.$emit('pick',[start,end]......
  • Nginx双层域名时 iframe嵌入/跳转页面的处理过程
    Nginx双层域名时iframe嵌入/跳转页面的处理过程背景两年前在上一家公司内遇到一个Nginx的问题当时的场景是双层nginx代理时(一层域名侧,一层拆分微服务的网关层)程序里面会打开一个嵌套的iframe,便于进行缩放.但是此时因为只能就近获取第二层反向代理的upstream的域......
  • LeetCode 658. Find K Closest Elements 二分+双指针
    Givenasortedintegerarrayarr,twointegerskandx,returnthekclosestintegerstoxinthearray.Theresultshouldalsobesortedinascendingorder.Anintegeraisclosertoxthananintegerbif:|a-x|<|b-x|,or|a-x|==|b-x|an......