el table怎么获取最后一行_element-ui里的el-table 前端分页
时间: 2023-10-18 19:15:36 浏览: 203
vue+elementUI组件table实现前端分页功能
要获取 Element UI 的 `el-table` 最后一行,可以通过以下步骤实现:
1. 获取 `el-table` 的所有行数据,可以通过 `this.$refs.table.data` 来获取,其中 `table` 是 `el-table` 的 `ref`。
2. 获取每页显示的行数,可以通过 `this.$refs.table.pageSizes` 来获取。
3. 计算当前页码 `currentPage`,可以通过 `this.$refs.table.store.states.currentPage` 来获取。
4. 计算最后一行的索引 `lastRowIndex`,公式为 `(currentPage - 1) * pageSize + data.length - 1`。
5. 获取最后一行数据,可以通过 `this.$refs.table.data[lastRowIndex]` 来获取。
完整代码示例:
```
// 获取每页显示的行数
const pageSize = this.$refs.table.pageSizes[this.$refs.table.store.states.pageSize]
// 计算当前页码
const currentPage = this.$refs.table.store.states.currentPage
// 获取所有行数据
const data = this.$refs.table.data
// 计算最后一行的索引
const lastRowIndex = (currentPage - 1) * pageSize + data.length - 1
// 获取最后一行数据
const lastRowData = this.$refs.table.data[lastRowIndex]
```
阅读全文