el-table表格与分页器实现跨页连续计数

最新推荐文章于 2024-09-19 21:59:01 发布

阳光雨滴

最新推荐文章于 2024-09-19 21:59:01 发布

阅读量262

点赞数 1

文章标签： vue.js javascript elementui

本文链接：https://blog.youkuaiyun.com/bbkhhvv/article/details/139685729

版权

直接看代码,只需要让页数pageNum减去1后去乘以要展示的数量pageSize再加上当前索引值加1就可以

  <el-table :data="tableData" stripe class="table" >
        <el-table-column label="序号" type="index" width="100">
          <template #default="scope">
            <span>{{(pageNum - 1) * pageSize + scope.$index + 1}}</span>
          </template>
        </el-table-column>
        <el-table-column label="名称" prop="title"></el-table-column>
  </el-table>

  <script lang="ts" setup>
     import { ref} from "vue";
     const pageSize = ref(10)
     const pageNum = ref(1)
  </script>