vue的页码组件的页码重置为1

重置页码组件

最新推荐文章于 2025-10-10 00:20:04 发布

原创最新推荐文章于 2025-10-10 00:20:04 发布 · 4.5k 阅读

6 ·

CC 4.0 BY-SA版权

文章标签：

#vue #重置页码为1

vue 专栏收录该内容

18 篇文章

订阅专栏

本文介绍了一种在Element UI的页码组件中重置页码的方法。通过在页码组件上绑定ref，可以找到该组件并将其重置到第一页。示例代码展示了如何使用Vue.js实现这一功能。

首先是页码组件上要绑定一个ref，然后通过ref找到这个组件，然后重置为1，

例子如下：

<el-pagination
        ref="Pagination"
        class="pages"
        @current-change="queryCurrentPage"
        :current-page.sync="currentPage"
        :page-size="10"
        layout="prev, pager, next, jumper"
        :total="totalPage">
 </el-pagination>

this.$refs.Pagination.lastEmittedPage = 1

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

lx_1024

关注关注

2
点赞
踩
6

收藏

觉得还不错? 一键收藏
1
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

vue+elementUI组件table实现前端分页功能

10-15

`handleSizeChange`方法在用户更改每页显示数量时被调用，它重置`currentPage`为1并更新`pageSize`。`handleCurrentChange`方法在用户切换页面时触发，更新`currentPage`的值。在实际项目中，你需要将`tableData`...

vue3实现瀑布流布局组件

guizi0809的博客

02-19

3032

先看效果图直接上代码 utils.js // 用于模拟接口请求 export const getRemoteData = (data = '获取数据', time = 2000) => { return new Promise((resolve) => { setTimeout(() => { console.log(`模拟获取接口数据`, data) resolve(data) }, time)

1 条评论您还未登录，请先登录后发表或查看评论

使用ViewPage时ViewPage中的页面重置问题

热门推荐

ygc87的专栏

04-05

2万+

当我们使用ViewPage控件时，假设我们的ViewPage有三页，当我们第一次启动ViewPage显示第一页的时候，ViewPage会预加载第二页，这样当我们向第二页滑动的时候就可以看见第二页的内容了，因为第二页的内容在第一页内容显示的时候就已经加载了。当我们滑动到第二页时，ViewPage会预加载第三页，这时ViewPage中已经保存了三页的内容：第一页，第二页和第三页，这样当我们在第二页向左

vue element的分页当前页重设为1

weixin_42382758的博客

09-25

2122

vue分页重置当前页

elementUI分页器Pagination自动到第一页

qq_43827328的博客

05-08

6537

当数据量过多时，使用分页分解数据。 <div class="pagination"> <el-pagination background layout="prev, pager, next" :current-page.sync="currentPage" @current-change="current_change" :page-size="7" :...

vue中elementUi筛选后分页页码恢复到第一页

qq_42483955的博客

06-07

3278

使用element做分页查询时解决添加筛选条件后页码没回到第一页

vue基于elementUi筛选后分页恢复默认第一页(也可用回显页)

boy火巨的博客

04-15

7552

问题描述：默认打开页面，分页是1；当点第二页之后再进行筛选位置，没加恢复之前接口传的页数还是2，返回第二页的数据；需求：当更改筛选时添加让页数更改为默认1；这时要添加:current-page.sync="pageNo" 当前页 <div class="pagination"> <el-pagination @current-c...

【组件封装】-【vue组件设计经验技巧】

CaraYQ的博客

04-05

1695

组件封装其实就是扩展性和便捷性的权衡，组件写死的部分多了，便捷性提升了，但是扩展性下降了，组件内很多内容依靠父组件传入，那么扩展性增强了，但是便捷性下降了。

13. vue2 组件轮播图实现思路解析

最新发布

weixin_63215361的博客

10-10

792

一定要在一次轮播图样式变化结束后，再将switching 状态锁设置为false,所以可以添加一个样式监听函数，当元素的样式发生变化完成后可以进行额外的操作。注意：轮播图在滑动实际是margin-top样式改变造成的，所以可以加一个样式变化过渡时间，【当在最后一页时，不显示⬇️按钮（因为不能再往下）】【当在第一页时，不显示⬆️按钮（因为不能再往上）】最终效果：每点一次，页面切换到下（或上）一个 li。点击：⬆️“上一页” → 显示前一张轮播图。点击：⬇️“下一页” → 显示后一张轮播图。

JeecgBoot-Vue3 BasicTable组件分页重置

07-08

在 `JeecgBoot-Vue3` 中使用 `BasicTable` 组件时，如果你希望在点击“重置”按钮或其他操作后**重置分页状态（如回到第一页）**，你需要通过调用 `BasicTable` 提供的 API 方法来实现。 ### ✅ 正确做法 `Basic...

分页刷新回到第一页【Vue、Element】

qq_22841387的博客

01-03

2555

保存当前状态：在用户进行分页切换时，将当前的分页页码保存到中。刷新后恢复状态：在页面加载时，检测中是否有之前保存的页码，如果有则自动恢复。路由跳转重置状态：当用户跳转到其他页面时，将分页状态重置为初始状态（例如：第一页）。data() {return {pagenum: 1, // 默认第一页// 其他查询参数},// 恢复分页状态},methods: {// 保存当前页码到 sessionStorage},// 恢复当前页码},// 重置分页为第一页next()

elementui里分页组件，点击换页默认跳回第一页的问题

weixin_47151361的博客

06-06

3915

elementui里分页组件，点击换页默认跳回第一页的问题

vue+element 分页current-page设置页码失效问题

qi琪的专栏

04-29

4265

需求：每经过一次新的查询后，分页页码就要调到第一页。我设置查询后current-page = 1问题：如果已经跳转到了下一页，在次查询，current-page = 1 会失效。经查资料： element 对双向绑定支持的不是很好。使用vue的sync修饰符。解决方案：将 current-page换成 current-page.sync [已验证] ...

ue3.0 页码组件分页组件重置到首页

sxy_qjj的博客

03-09

227

网上看到有两种方法： 1、绑定key值参考位置：https://blog.youkuaiyun.com/weixin_30561425/article/details/95282665 2、ref属性参考位置：https://blog.youkuaiyun.com/Xl4277/article/details/103564296 实际解决方法：我用的是3.0，通过第二种方法大概会报下面的错误：接着输出发现是internalCurrentPage 关于第一种方法：我一开始使用的就是...

antd vue修改分页【pagination】，数据改变时，分页重置到第一页

weixin_45686196的博客

07-20

3647

我这里的pagination配置需要调用配置项paginationProps的onChange回调。current属性，看文档使用v-model方式用pagination可以改值，请求数据时可以重置为1即可。我项目中用到的是中的pagination配置。

element-ui el-pagination组件初始化

wangjinbao123456的博客

03-21

3443

饿了么提供的el-pagination组件没有提供定位到第一页的方法，通过current-page属性设置页码虽然定位到第一页了，但是el-pagination组件还是认为当前页面是上次手动点击的页码例如：用户在当前页面浏览到了第三页，当手动设置current-page=1时，虽然看起来el-pagination处在第一页，但是实际上el-pagination认为自己当前处在第三页，现在点击第...

el-pagination选中页码和vuex存的页码不一致

weixin_43778272的博客

07-21

590

在使用 Element UI 中的 pagination 时出现了一个问题。点击页页码可以正常跳转，跳转到对应页面后，再跳转到其他路由，然后返回。页码又被重置为4。分页组件拿到不合法的 currentPage 会将页码重置为 1，即使之后修改了 total ，也不会重置 currentPage。奇怪的是，我已经将页码数据存储到 vuex 中，而且通过 vue devtool 查看确实页码数据并不为4。解决方法：将 total 初始值置为 null 而不是 0即可生效选中当前页码和vuex缓存一致。

element-ui 分页pagination组件动态设置默认页码

weixin_45832746的博客

07-26

984

【代码】element-ui 分页pagination组件动态设置默认页码。

element-UI 分页器Bug，切换页面展示数量，页码刷新重置，原来页码高亮问题

Amanda_wmy的博客

01-24

6155

element-UI 分页器Bug，切换页面展示数量，页码刷新重置，原来页码高亮问题 Element-UI提供了分页器的两个方法，handleSizeChange和handleCurrentChange，然而在实际使用中，却发现再切换页面展示数量的时候，会出现一些BUG，页面刷新了，高亮页码却还是上次选择的页面。可以用以下方法解决；翻看element文档中发现有current-page，当前...