el-table增加序号列

wangshuai0927

5559人浏览 · 2022-07-28 21:59:08

wangshuai0927 · 2022-07-28 21:59:08 发布

el-table增加序号列，使用slot-scope作用域插槽，{{}}插值表达式显示数据，scope.$index是行索引，从0开始，行索引加1就是序号。

<el-table-column label="序号" width="50px" align="center">
              <template slot-scope="scope">
                {{ scope.$index + 1 }}
              </template>
            </el-table-column>

View Design

基于 Vue 的企业级 UI 组件库和中后台系统解决方案，为数万开发者服务。

更多推荐

Element UI组件介绍

简介element ui 就是基于vue的一个ui框架,该框架基于vue开发了很多相关组件,方便我们快速开发页面。1、安装Element UI，通过vue脚手架创建项vue init webpack element(项目名)2、在vue脚手架项目中安装elementui# 1.下载elementui的依赖npm i element-ui -S# 2.指定当前项目中使用elementuiimport