要求分页可以点击后就跳转到相应页面

如果要实现分页可以点击后就跳转到相应页面，需要在每个分页按钮上添加一个链接，将链接指向相应的选项卡页面。具体实现可以在每个按钮上添加一个 `href` 属性，属性值为选项卡页面的链接地址。例如：

<ul class="pagination justify-content-center mt-3">
  <li class="page-item">
    <a class="page-link btn btn-link active" href="#page1" data-toggle="tab" aria-pressed="true">1</a>
  </li>
  <li class="page-item">
    <a class="page-link btn btn-link" href="#page2" data-toggle="tab">2</a>
  </li>
  <li class="page-item">
    <a class="page-link btn btn-link" href="#page3" data-toggle="tab">3</a>
  </li>
  <li class="page-item">
    <a class="page-link btn btn-link" href="#page4" data-toggle="tab">4</a>
  </li>
</ul>

这样，当用户点击分页按钮时，就会跳转到相应的选项卡页面。

相关问题

使用vue3 pinia 写出表格分页的代码 点击页码跳转到相应页面

以下是使用Vue3 Pinia实现表格分页的代码示例：

<template>
  <div>
    <table>
      <thead>
        <tr>
          <th>ID</th>
          <th>Name</th>
          <th>Age</th>
        </tr>
      </thead>
      <tbody>
        <tr v-for="item in paginatedData" :key="item.id">
          <td>{{ item.id }}</td>
          <td>{{ item.name }}</td>
          <td>{{ item.age }}</td>
        </tr>
      </tbody>
    </table>
    <div v-if="totalPages > 1">
      <ul>
        <li v-for="page in totalPages" :key="page">
          <button @click="goToPage(page)" :class="{ active: currentPage === page }">{{ page }}</button>
        </li>
      </ul>
    </div>
  </div>
</template>

<script>
import { defineComponent, computed } from 'vue'
import { useStore } from 'pinia'

export default defineComponent({
  name: 'TablePagination',
  setup() {
    const store = useStore()

    const currentPage = computed(() => store.currentPaginationPage)
    const itemsPerPage = computed(() => store.itemsPerPage)
    const tableData = computed(() => store.tableData)

    const totalPages = computed(() => Math.ceil(tableData.value.length / itemsPerPage.value))

    const paginatedData = computed(() => {
      const start = (currentPage.value - 1) * itemsPerPage.value
      const end = start + itemsPerPage.value
      return tableData.value.slice(start, end)
    })

    function goToPage(page) {
      store.setCurrentPaginationPage(page)
    }

    return {
      currentPage,
      itemsPerPage,
      tableData,
      totalPages,
      paginatedData,
      goToPage,
    }
  },
})
</script>

在此示例中，我们使用了Pinia来管理状态，并使用计算属性来计算分页后的数据和总页数。我们还使用了一个方法来设置当前页码并更新状态。在模板中，我们使用了v-for指令来渲染表格和页码，并根据当前页码设置活动按钮的样式。点击页码时，我们将调用goToPage方法来设置新的当前页码。

Vue.js结合Element-UI实现分页跳转页面详情返回记住当前点击第几页

好的，针对你的问题，我理解你的意思是想要实现以下功能：

1. 使用Vue.js和Element-UI实现分页功能；
2. 点击分页按钮跳转到相应页面；
3. 在详情页面中返回时，记住之前点击的是第几页。

为了实现这个功能，可以按照以下步骤进行：

1. 在Vue.js中引入Element-UI的分页组件，并设置相应的属性，如当前页数、每页显示条数、总条数等。具体可以参考Element-UI的文档：https://element.eleme.cn/#/zh-CN/component/pagination。

2. 在分页组件中绑定一个点击事件，当用户点击分页按钮时，触发该事件并传递当前点击的页码。

3. 在页面跳转时，将当前点击的页码作为参数传递给目标页面。

4. 在详情页面中，可以使用Vue.js的全局状态管理工具（如Vuex）来记录当前点击的页码。在返回时，再将该页码作为参数传递回原页面，并将分页组件的当前页数设置为该页码。

这样就可以实现在分页跳转时记住当前点击的页码的功能了。