当前位置:网站首页>Add a self incrementing sequence number to the antd table component
Add a self incrementing sequence number to the antd table component
2022-07-07 11:09:00 【Have a good time I】
The complete code is as follows :
<a-table :columns="columns" :data-source="students" :pagination="false" rowKey="id" @change="handleTableChange">
<div slot="num" slot-scope="text, record, index">{
{
(currentPage - 1) * pageSize + (index + 1) }}</div>
<div slot="action" slot-scope="text, item">
<a-button type="link" :disabled="detail.status === 2" @click="handleDel(item)"> Delete </a-button>
<a-button
v-if="detail.type === 1"
type="link"
@click="pathTo('/classroom/flow/' + detail.id + '/' + item.id)"
>
Assembly line </a-button
>
</div>
</a-table>
const columns = [
{
title: ' Serial number ',
scopedSlots: {
customRender: 'num' }
},
{
title: ' Student number ',
dataIndex: 'no',
align: 'center',
filters: [
{
text: ' Ascending ', value: 'no asc' },
{
text: ' Descending ', value: 'no desc ' }
],
filterMultiple: false,
filteredValue: filteredInfo.no || null
},
{
title: ' full name ',
dataIndex: 'name',
align: 'center',
filters: [
{
text: ' Ascending ', value: 'name asc' },
{
text: ' Descending ', value: 'name desc ' }
],
filterMultiple: false,
filteredValue: filteredInfo.name || null
},
{
title: ' operation ',
align: 'center',
scopedSlots: {
customRender: 'action' }
}
]
From which Paging consecutive auto increment sequence number as follows :
<div slot="num" slot-scope="text, record, index">{
{
(currentPage - 1) * pageSize + (index + 1) }}</div>
Every page from 1 Start
边栏推荐
- The gun startles the dragon, and the crowd "locks" Zhou Zhi
- The eighth training assignment
- [untitled]
- [OneNote] can't connect to the network and can't sync the problem
- Unity script generates configurable files and loads
- 从色情直播到直播电商
- The concept, implementation and analysis of binary search tree (BST)
- Find the root of equation ax^2+bx+c=0 (C language)
- From pornographic live broadcast to live broadcast E-commerce
- seata 1.3.0 四种模式解决分布式事务(AT、TCC、SAGA、XA)
猜你喜欢
2021 summary and 2022 outlook
ADB utility commands (network package, log, tuning related)
Mysql的json格式查询
Use load_ decathlon_ Datalist (Monai) fast loading JSON data
Operation method of Orange Pie orangepi 4 lts development board connecting SATA hard disk through mini PCIe
[STM32] actual combat 3.1 - drive 42 stepper motors with STM32 and tb6600 drivers (I)
[système recommandé 01] rechub
Simple and easy to modify spring frame components
Seata 1.3.0 four modes to solve distributed transactions (at, TCC, Saga, XA)
verilog设计抢答器【附源码】
随机推荐
[installation system] U disk installation system tutorial, using UltraISO to make U disk startup disk
【安装系统】U盘安装系统教程,使用UltraISO制作U盘启动盘
Online hard core tools
[actual combat] transformer architecture of the major medical segmentation challenges on the list --nnformer
一些线上学术报告网站与机器学习视频
I plan to take part in security work. How about information security engineers and how to prepare for the soft exam?
关于jmeter中编写shell脚本json的应用
“梦想杯”2017 年江苏省信息与未来小学生夏令营 IT 小能手 PK 之程序设计试题
Those confusing concepts (3): function and class
单调性约束与反单调性约束的区别 monotonicity and anti-monotonicity constraint
基于DE2 115开发板驱动HC_SR04超声波测距模块【附源码】
[untitled]
MPX plug-in
请问申购新股哪个证券公司开户是最好最安全的
What are the test preparation materials and methods for soft exam information processing technicians?
Go-Redis 中间件
[C #] the solution of WinForm operation zoom (blur)
Still cannot find RPC dispatcher table failed to connect in virtual KD
【STM32】实战3.1—用STM32与TB6600驱动器驱动42步进电机(一)
Différences entre les contraintes monotones et anti - monotones