elementui tabel组件scope.$index的使用

tabel组件的自定义列模板中可以使用scope.row获取当前行的数据,而scope.$index获取的是当前行的数据在数组中的索引(tabel表格绑定的数据是一个数组,数组中每一个对象就相当于一行的数据)

使用如下:

<el-table-column prop="age" label="年龄">
  <template slot-scope="scope">
    <span @click="editor(scope.row,scope.$index)">编辑</span>
  </template>
</el-table-column>

element获取单行的下标(scope.$index)

scope.$index

 <el-table-column
   fixed="right"
   label="操作"
   width="100">
   <template slot-scope="scope">
     <el-button class="del" @click.stop="contractInvoiceDataDel(scope.$index)" type="text" size="small">删除</el-button>
   </template>
 </el-table-column>

以上为个人经验,希望能给大家一个参考,也希望大家多多支持Devmax。

elementui中tabel组件的scope.$index的使用及说明的更多相关文章

  1. elementui中使用el-tree控件懒加载和局部刷新

    这篇文章主要介绍了elementui中使用el-tree控件懒加载和局部刷新,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  2. elementui中tabel组件的scope.$index的使用及说明

    这篇文章主要介绍了elementui中tabel组件的scope.$index的使用及说明,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  3. elementui使用el-upload组件如何实现自定义上传

    这篇文章主要介绍了elementui使用el-upload组件如何实现自定义上传,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  4. Vue3 elementUI如何修改el-date-picker默认时间

    这篇文章主要介绍了Vue3 elementUI如何修改el-date-picker默认时间,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  5. ElementUI中利用table表格自定义表头Tooltip文字提示

    这篇文章主要介绍了ElementUI中利用table表格自定义表头Tooltip文字提示,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  6. Vue+ElementUI 实现分页功能-mysql数据

    这篇文章主要介绍了Vue+ElementUI 实现分页查询-mysql数据,当数据库中数据比较多时,就每次只查询一部分来缓解服务器和页面压力。这里使用elementui的 Pagination 分页 组件,配合mysql的limit语句,实现分页查询mysql数据,下面来看看具体实现过程,希望对大家学习有所帮助

  7. vue+elementUI组件tree如何实现单选加条件禁用

    这篇文章主要介绍了vue+elementUI组件tree如何实现单选加条件禁用,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  8. element日期选择器el-date-picker样式图文详解

    最近写的项目里面有一个功能是日期选择功能,第一反应是使用element里面的el-date-picker组件,下面这篇文章主要给大家介绍了关于element日期选择器el-date-picker样式的相关资料,需要的朋友可以参考下

  9. Vue elementUI实现树形结构表格与懒加载

    这篇文章主要介绍了通过Vue和elementUI实现树形结构表格与懒加载,文中的示例代码讲解详细,感兴趣的小伙伴快来跟随小编一起学习一下吧

  10. 关于ElementUI自定义Table支持render

    这篇文章主要介绍了关于ElementUI自定义Table支持render,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

随机推荐

  1. js中‘!.’是什么意思

  2. Vue如何指定不编译的文件夹和favicon.ico

    这篇文章主要介绍了Vue如何指定不编译的文件夹和favicon.ico,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  3. 基于JavaScript编写一个图片转PDF转换器

    本文为大家介绍了一个简单的 JavaScript 项目,可以将图片转换为 PDF 文件。你可以从本地选择任何一张图片,只需点击一下即可将其转换为 PDF 文件,感兴趣的可以动手尝试一下

  4. jquery点赞功能实现代码 点个赞吧!

    点赞功能很多地方都会出现,如何实现爱心点赞功能,这篇文章主要为大家详细介绍了jquery点赞功能实现代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  5. AngularJs上传前预览图片的实例代码

    使用AngularJs进行开发,在项目中,经常会遇到上传图片后,需在一旁预览图片内容,怎么实现这样的功能呢?今天小编给大家分享AugularJs上传前预览图片的实现代码,需要的朋友参考下吧

  6. JavaScript面向对象编程入门教程

    这篇文章主要介绍了JavaScript面向对象编程的相关概念,例如类、对象、属性、方法等面向对象的术语,并以实例讲解各种术语的使用,非常好的一篇面向对象入门教程,其它语言也可以参考哦

  7. jQuery中的通配符选择器使用总结

    通配符在控制input标签时相当好用,这里简单进行了jQuery中的通配符选择器使用总结,需要的朋友可以参考下

  8. javascript 动态调整图片尺寸实现代码

    在自己的网站上更新文章时一个比较常见的问题是:文章插图太宽,使整个网页都变形了。如果对每个插图都先进行缩放再插入的话,太麻烦了。

  9. jquery ajaxfileupload异步上传插件

    这篇文章主要为大家详细介绍了jquery ajaxfileupload异步上传插件,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  10. React学习之受控组件与数据共享实例分析

    这篇文章主要介绍了React学习之受控组件与数据共享,结合实例形式分析了React受控组件与组件间数据共享相关原理与使用技巧,需要的朋友可以参考下

返回
顶部