Skip to content

API(useXTableApi)

通过 useXTableApi 获取 ref 包装的 API,直接绑定到 @register

vue
<template>
  <XTable :columns="columns" :data="data" @register="tableApi.register" />
  <el-button @click="tableApi.clearSelection()">清空</el-button>
</template>

<script setup lang="ts">
import { useXTableApi } from '@/components/XTable'

const tableApi = useXTableApi<User>()
</script>

方法列表

分类方法说明
EP 实例方法(自动透传)clearSelection() / toggleRowSelection(...) / toggleAllSelection() / toggleRowExpansion(...) / setCurrentRow(...) / getSelectionRows() / clearSort() / clearFilter(...) / doLayout() / sort(...) / updateKeyChildren(...) / scrollTo(...) / setScrollTop(...) / setScrollLeft(...) ...所有 Element Plus el-table expose 的方法都直接可用;EP 升级新增方法自动同步,无需修改 XTable。类型继承自 TableInstance
事件event事件对象(直接赋值属性)
数据getData()获取当前数据
setData(data)设置数据(静态模式会重置分页到第 1 页)
fetchData(params?)远程请求;params 与现有 queryParams 合并
getQueryParams()获取查询参数(返回副本)
setQueryParams(params)整体替换查询参数
只读状态loading加载中(getter)
total数据总数(getter)
分页setPage(page)设置当前页
setPageSize(size)设置每页条数(会重置到第 1 页)
getPagination()获取 { page, pageSize }
resetPagination()重置到第 1 页(远程模式下自动请求)

EP 完整 expose 方法列表见 Element Plus Table 文档 - Table Exposes 章节。

Released under the MIT License.