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

更新时间：2022年10月20日 09:53:34 作者：小智玩前端

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

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>

以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

详解Vue的组件中data选项为什么必须是函数
这篇文章主要给大家介绍了关于Vue的组件中data选项为什么必须是函数的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者使用Vue具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧
2020-08-08
vue实现锚点跳转scrollIntoView()使用案例
这篇文章主要介绍了vue实现锚点跳转scrollIntoView()使用案例，文中结合实例代码介绍了vue锚点跳转的三种方式(页内跳转，跨页跳转，函数跳转),需要的朋友可以参考下
2023-07-07
vue中将网页打印成pdf实例代码
本篇文章主要介绍了vue中将网页打印成pdf实例代码，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2017-06-06
vue3中vue.config.js配置及注释详解
在Vue 3.0中,与2.0版本相比有一定的差别,最明显的就是缺少了build、config文件夹,下面这篇文章主要给大家介绍了关于vue3中vue.config.js配置及注释的相关资料,需要的朋友可以参考下
2022-08-08
vue3中实现文本显示省略号和tooltips提示框的方式详解
在 B 端业务中,我们经常会遇到文本内容超出容器区域需显示省略号的需求,当鼠标移入文本时,会出现 Tooltip 显示完整内容,最近,我也遇到了这样的场景,接下来给大家介绍vue3中实现文本显示省略号和tooltips提示框的方式,需要的朋友可以参考下
2024-04-04
配置vite.confgi.ts无法使用require问题以及解决
这篇文章主要介绍了配置vite.confgi.ts无法使用require问题以及解决方案，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
2023-05-05
vue 实现LED数字时钟效果（开箱即用）
这篇文章主要介绍了vue 实现LED数字时钟效果（开箱即用）,每一个数字由七个元素构成，即每一个segment元素，本文给大家分享实现实例，感兴趣的朋友一起看看吧
2019-12-12
vue中@click绑定多个事件问题(教你避坑)
这篇文章主要介绍了vue中@click绑定多个事件问题(教你避坑),具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
2024-08-08
vue 实现小程序或商品秒杀倒计时
这篇文章主要介绍了vue 实现倒计时秒杀的组件，紧接着通过实例代码给大家介绍小程序或者vue商品秒杀倒计时功能,需要的朋友可以参考下
2019-04-04
vue2-elementUI部分组件样式修改方法
这篇文章主要介绍了vue2-elementUI部分组件样式修改,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧
2023-12-12