首页 > 其他分享 >[Vue]按页数和行数重新计算表格序号

[Vue]按页数和行数重新计算表格序号

时间:2023-12-04 12:12:25浏览次数:33  
标签:Vue pageNum pageSize 表格 页数 行数 page

转载自:https://blog.csdn.net/qq_48203828/article/details/123224024

 

1、

 

2、

<el-table-column label="序号" style="width: 120px; height: 50px" header-align="center" align="center">
    <template slot-scope="scope">
        <span>{{ (page.pageNum - 1) * page.pageSize + scope.$index + 1 }}</span>
    </template>
</el-table-column>

 


page.pageNum 要和表格的下边的分页字段要一致。
page.pageSize 要和表格的下边的分页字段要一致。

标签:Vue,pageNum,pageSize,表格,页数,行数,page
From: https://www.cnblogs.com/ximu1009/p/17874624.html

相关文章

  • Vue3用户代码片段
    1.defineComponent语法{ "Printtoconsole":{ "prefix":"vue3", "body":[ "<template>", "<divclass=\"container\">", "", "</div>&q......
  • 在写springboot和vue时,需要改进的地方
    后端Springboot(1)需要更加熟练使用mysql语句,insertupdatedeleteselect(查询)(2)前后端跨域问题的解决: (3)另外在使用delete语句时,可以在路径中直接添加id,实现通过id删除数据例①未在路径中添加id  ②在路径中使用idpostman中样例:  使用id作为路径参数的注意事项:......
  • Jenkins自动化构建Vue项目的实践
    在现代的Web开发中,Vue.js已经成为一种非常流行的JavaScript框架。为了更高效地管理和部署Vue.js项目,使用自动化构建工具是至关重要的。Jenkins作为一款强大的持续集成和持续部署(CI/CD)工具,为我们提供了一种便捷的方式来自动化构建Vue.js项目。本文将介绍如何在Jenkins中配置和使用自......
  • vue 弹窗组件
    vue弹窗<el-dialog></el-dialog>可以在其中编写所需的弹窗显示的内容也可以在其中放组件标签作为弹窗放一个组件的话,例:<el-dialogv-model="addGoodsDialog":title="addGoodsTitle"width="60%"destroy-on-close="true":close-on-p......
  • vue 编辑器+使用场景+问题解决
    vue编辑器组件添加依赖"dependencies":{"@codemirror/autocomplete":"^6.4.2","@codemirror/commands":"^6.2.1","@codemirror/lang-javascript":"^6.0.2","@codemirror/lan......
  • vue 循环显示数据场景
    vue循环显示数据el-table中<template> <el-table:data="goodsList"> <el-table-columnprop="goodsName"label="商品名称"></el-table-column> <!--......--></el-table></template>......
  • 基于uQRCode封装的Vue3二维码生成插件
    标题:基于uQRCode封装的Vue3二维码生成插件摘要:本文介绍了一种基于uQRCode封装的Vue3二维码生成插件,可以在Javascript运行环境下生成二维码并返回图片地址。该插件适用于所有Javascript运行环境,并且支持微信小程序。本文将详细介绍该插件的使用方法,并给出一个基于Vue3的示例。关......
  • 自定义精美商品分类列表组件 侧边栏商品分类组件 category组件(适配vue3)
    随着技术的发展,开发的复杂度也越来越高,传统开发方式将一个系统做成了整块应用,经常出现的情况就是一个小小的改动或者一个小功能的增加可能会引起整体逻辑的修改,造成牵一发而动全身。通过组件化开发,可以有效实现单独开发,单独维护,而且他们之间可以随意的进行组合。大大提升开发效率......
  • vue3中css使用js中的变量
    <scriptsetuplang="ts">import{SoundOutlined}from'@ant-design/icons-vue'constprops=defineProps({title:{type:String,default:''},color:{type:String,default:'#000'}......
  • Vue 常用的指令都有哪些?
    1、v-model多用于表单元素实现双向数据绑定(同angular中的ng-model)2、v-for格式:v-for="字段名in(of)数组json"循环数组或json(同angular中的ng-repeat),需要注意从vue2开始取消了$index3、v-show显示内容(同angular中的ng-show)4、v-hide隐藏内容(同angular......