vue 表格组件,记录 vxe-table grid 获取 rowIndex 行索引、列索引的详细说明
https://vxetable.cn
表格有 3 种索引机制:
行索引:rowIndex
、$rowIndex
、_rowIndex
列索引:columnIndex
、$columnIndex
、_columnIndex
不同的索引区别在于是否启用虚拟滚动,如果未启用虚拟滚动情况下,基本都相同的;如果启用虚拟滚动后,如果需要用到索引,那就需要区分索引了。
row:行数据对象
rowIndex:指向 props.data 中的索引,对应方法 getRowIndex(row)
$rowIndex:指向可视区渲染中的行索引,对应方法 getVMRowIndex(row)
_rowIndex:指向当前表格数据的索引,对应方法 getVTRowIndex(row)
column:列配置对象
columnIndex:指向 props.columns 中的索引,对应方法 getColumnIndex(column)
$columnIndex:指向可视区渲染中的列索引,对应方法 getVMColumnIndex(column)
_columnIndex:指向当前表格列的索引,对应方法 getVTColumnIndex(column)
表格插槽获取
插槽模板中可以通过参数直接获取
// ...
<vxe-column ...>
<template #default="{ rowIndex, $rowIndex, _rowIndex }">
<span>{{ rowIndex }} 指向 props.data 中的索引</span>
<span>{{ $rowIndex }} 指向可视区渲染中的行索引</span>
<span>{{ _rowIndex }} 指向当前表格数据的索引</span>
<template>
</vxe-column>
// ...
调用方法获取
可以通过调用方法方式获取指定行的索引
// ...
const $table = tableRef.value
$table.getRowIndex(row) // 指向 props.data 中的索引
$table.getVMRowIndex(row) // 指向可视区渲染中的行索引
$table.getVTRowIndex(row) // 指向当前表格数据的索引
// ...
https://gitee.com/x-extends/vxe-table
来源链接:https://www.cnblogs.com/qaz666/p/18879589
© 版权声明
本站所有资源来自于网络,仅供学习与参考,请勿用于商业用途,否则产生的一切后果将由您(转载者)自己承担!
如有侵犯您的版权,请及时联系3500663466#qq.com(#换@),我们将第一时间删除本站数据。
如有侵犯您的版权,请及时联系3500663466#qq.com(#换@),我们将第一时间删除本站数据。
THE END
暂无评论内容