iView UI 使用page分页添加跳转按钮-输入页码后点击跳转

最新推荐文章于 2024-03-13 16:49:22 发布

S筱潇S四维Smile

最新推荐文章于 2024-03-13 16:49:22 发布

阅读量673

点赞数

分类专栏： HTML JavaScript 文章标签： vue.js 前端

本文链接：https://blog.csdn.net/qq_29483485/article/details/124043399

版权

本文介绍了如何在iView UI的分页组件中添加一个跳转按钮，以便用户在输入页码后直接点击跳转，而无需按回车。通过手动设置pageId或使用ref来获取分页组件的DOM，实现模拟点击功能，提升用户体验。

摘要由CSDN通过智能技术生成

使用电梯，快速跳转到某一页

在iview里,分页组件的电梯功能输入页码后需要按回车才能跳转

这让不知道需要按回车的人摸不着头脑呀,所以呢,动动手写个跳转按钮~

<div class="overflow-h mt10">
          <span class="fr mt5 ml10">
              <Button class="btn-page mr10" type="primary" size="small" @click="goElevatorPage">跳转</Button>
              共<span class="blue">{
  {pageData.pageTotal}}</span>页,
              共<span class="blue">{
  {pageData.dataTotal}}</span>条
          </span>
          <Page id="page" ref="myPage" class="fr" :total="pageData.dataTotal" @on-change="setPage" @on-page-size-change="chooseSize