PrimeVue DataTable 属性值解析

2024-08-31 17:44

本文主要是介绍PrimeVue DataTable 属性值解析,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

primeVue DataTable组件的属性值使用

DataTable属性
NameTypeDefaultdescription
valuenull | any[]

null

要显示的对象数组。
dataKeystring | Function

null

唯一标识数据中的记录的字段名称。
rowsnumber

0

每页显示的行数。
firstnumber

0

要显示的第一行的索引。
totalRecordsnumber

0

总记录数,未定义时默认为值的长度。
paginatorboolean

false

当指定为 true 时,启用分页。
paginatorPosition"top" | "bottom" | "both"

bottom

分页器的位置,选项为“顶部”、“底部”或“两者”。
alwaysShowPaginatorboolean

true

即使只有一页也显示
paginatorTemplateany

FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown

分页器的模板。可以使用预定义键通过模板属性进行自定义。- FirstPageLink - PrevPageLink - PageLinks - NextPageLink - LastPageLink - RowsPerPageDropdown - JumpToPageDropdown - JumpToPageInput - CurrentPageReport
pageLinkSizenumber

5

要显示的页面链接数。
rowsPerPageOptionsnumber[]

null

每页下拉列表中显示的行内的整数值数组。
currentPageReportTemplatestring

'({currentPage} of {totalPages})'

当前页面报告元素的模板。它显示有关分页状态的信息。可用的占位符如下:- {currentPage} - {totalPages} - {rows} - {first} - {last} - {totalRecords}
lazyboolean

false

定义是否以惰性方式加载和交互数据。
loadingboolean

false

显示加载器以指示数据加载正在进行中。
loadingIconstring

null

显示的图标表示数据加载正在进行中。
sortFieldstring | Function

null

默认用于排序的行数据的属性名或 getter 函数
sortOrdernumber

null

按默认顺序对数据进行排序。
nullSortOrdernumber

1

确定空值的排序方式。
defaultSortOrdernumber

1

未排序列的默认排序顺序。
multiSortMetaDataTableSortMeta[]

null

用于对数据进行排序的 SortMeta 对象数组。
sortMode"single" | "multiple"

single

定义排序是否对单列或多列进行。
removableSortboolean

false

启用后,列可以处于未排序状态。
filtersDataTableFilterMeta

null

使用键值对的过滤器对象来定义过滤器。
filterDisplay"menu" | "row"

null

过滤元件的布局。
globalFilterFields(string | Function)[]

null

用于全局过滤的字符串或函数形式的字段数组。
filterLocalestring

null

过滤时使用的区域设置。默认区域设置是主机环境的当前区域设置。
selectionany

null

在单一模式下选定行或在多重模式下选定值数组。
selectionMode"single" | "multiple"

null

指定选择模式。
compareSelectionBy"equals" | "deepEquals"

deepEquals

定义是否选择了某一行的算法。
metaKeySelectionboolean

false

定义选择是否需要 metaKey。设置为 true 时,需要按下 metaKey 来选择或取消选择某项;设置为 false 时,可以单独切换每项选择。在支持触摸的设备上,metaKeySelection 会自动关闭。
contextMenuboolean

false

启用上下文菜单集成。
contextMenuSelectionany

null

使用 ContextMenu 选定的行实例。
selectAllNullable<boolean>

null

是否选择所有数据。
rowHoverboolean

false

启用后,行的背景会在悬停时发生变化。
csvSeparatorstring

,

用作 csv 分隔符的字符。
exportFilenamestring

download

导出文件的名称。
exportFunctionFunction

null

resizableColumnsboolean

false

启用后,可以通过拖放操作调整列的大小。
columnResizeMode"fit" | "expand"

fit

定义表格的整体宽度。
reorderableColumnsboolean

false

启用后,可以通过拖放操作对列进行重新排序。
expandedRowsnull | any[] | DataTableExpandedRows

null

以扩展形式显示的行数据集合。
expandedRowIconstring

null

行切换器的图标用于显示扩展的行。
collapsedRowIconstring

null

行切换器的图标用于显示折叠的行。
rowGroupMode"subheader" | "rowspan"

null

定义行组模式。
groupRowsBystring | string[] | Function

null

用于行分组的一个或多个字段名称。
expandableRowGroupsboolean

false

行组是否可以展开。
expandedRowGroupsany[] | DataTableExpandedRows

null

一组字段值的数组,这些字段值的组将呈现为展开的。
stateStorage"session" | "local"

session

定义有状态表保存其状态的位置。
stateKeystring

null

在状态存储中使用的有状态表的唯一标识符。
editMode"row" | "cell"

null

定义单元格内的编辑模式。
editingRowsany[] | DataTableEditingRows

null

用于表示行编辑模式下当前编辑数据的行集合。
rowClassFunction

null

rowStyleFunction

null

scrollableboolean

false

指定后,启用水平和/或垂直滚动​​。
scrollHeightHintedString<"flex">

null

滚动视口的高度(以固定像素为单位)或“flex”关键字表示动态尺寸。
virtualScrollerOptionsanynull是否使用 virtualScroller 特性。VirtualScroller 组件的属性可以像对象一样使用。注意:目前仅支持垂直方向模式。
frozenValuenull | any[]null可滚动 DataTable 中冻结部分的项目。
breakpointstring960px使用堆栈响应式布局时定义最大宽度边界的断点。
showGridlinesbooleanfalse是否显示单元格之间的网格线。
stripedRowsbooleanfalse是否以交替颜色显示行。
highlightOnSelectbooleanfalse自动突出显示第一项。
size"large" | "small"null定义表的大小。
tableStylestring | objectnull表格元素的内联样式。
tableClassstring | objectnull表格元素的样式类。
tablePropsTableHTMLAttributesnull用于将 TableHTMLAttributes 的所有属性传递给组件内的表元素。
filterInputProps

InputHTMLAttributes

输入HTML属性

null用于将 HTMLInputElement 的所有属性传递给组件内部可聚焦的过滤输入元素。
filterButtonProps

DataTableFilterButtonPropsOptions

数据表过滤器按钮属性选项

null用于传递所有过滤器按钮属性对象
editButtonProps

DataTableEditButtonPropsOptions

数据表编辑按钮道具选项

null用于传递所有编辑按钮属性对象
dtanynull它使用组件的设计令牌生成范围 CSS 变量。
ptPassThrough<DataTablePassThroughOptions>null用于将属性传递给组件内部的 DOM 元素。
ptOptionsanynull用于配置组件的passthrough(pt)选项。
unstyledbooleanfalse启用后,它会删除核心中与组件相关的样式。

Emits

Emits
nameparametersreturnTypedescription
update:first

value: number

void

当第一次改变时发出。
update:rows

value: number

void

当行发生变化时发出。
update:sortField

value: string

void

当 sortField 改变时发出。
update:sortOrder

value: undefined | number

void

当 sortOrder 改变时发出。
update:multiSortMeta

value: undefined | null | DataTableSortMeta[]

void

当 multiSortMeta 改变时发出。
update:selection

value: any

void

当选择改变时发出。
update:contextMenuSelection

value: any

void

当 contextMenuSelection 改变时发出
update:expandedRows

value: any[] | DataTableExpandedRows

void

当expandedRows改变时发出。
update:expandedRowGroups

value: any[] | DataTableExpandedRows

void

当expandedRowGroups改变时发出。
update:filters

value: DataTableFilterMeta

void

当过滤器改变时发出。
update:editingRows

value: any[] | DataTableEditingRows

void

当 editingRows 改变时发出。
page

event: DataTablePageEvent

void

分页时调用的回调。排序和过滤信息也可用于延迟加载实现。
sort

event: DataTableSortEvent

void

排序时调用的回调。页面和过滤器信息也可用于延迟加载实现。
filter

event: DataTableFilterEvent

void

过滤后发出的事件,在惰性模式下不会触发。
value-change

value: any[]

void

过滤、排序、分页和单元格编辑后调用的回调来传递渲染的值。
row-click

event: DataTableRowClickEvent

void

当单击某一行时调用的回调。
row-dblclick

event: DataTableRowDoubleClickEvent

void

双击某一行时调用的回调。
row-contextmenu

event: DataTableRowContextMenuEvent

void

当使用 ContextMenu 选择一行时调用的回调。
row-select

event: DataTableRowSelectEvent

void

当选择一行时调用的回调。
row-select-all

event: DataTableRowSelectAllEvent

void

当选中标题复选框时触发。
row-unselect-all

event: DataTableRowUnselectAllEvent

void

当标题复选框未选中时触发。
row-unselect

event: DataTableRowUnselectEvent

void

当取消选择某一行时调用的回调。
select-all-change

event: DataTableSelectAllChangeEvent

void

当选择所有数据时调用的回调
column-resize-end

event: DataTableColumnResizeEndEvent

void

当调整列大小时调用的回调。
column-reorder

event: DataTableColumnReorderEvent

void

当列重新排序时调用的回调。
row-reorder

event: DataTableRowReorderEvent

void

当行重新排序时调用的回调。
row-expand

event: DataTableRowExpandEvent

void

当行展开时调用的回调。
row-collapse

event: DataTableRowCollapseEvent

void

当行折叠时调用的回调。
rowgroup-expand

event: DataTableRowExpandEvent

void

当行组展开时调用的回调。
rowgroup-collapse

event: DataTableRowCollapseEvent

void

当行组折叠时调用的回调。
cell-edit-init

event: DataTableCellEditInitEvent

void

当启动单元格编辑时调用的回调。
cell-edit-complete

event: DataTableCellEditCompleteEvent

void

当单元格编辑完成时调用的回调。
cell-edit-cancel

event: DataTableCellEditCancelEvent

void

当使用退出键取消单元格编辑时调用的回调。
row-edit-init

event: DataTableRowEditInitEvent

void

当启动行编辑时调用的回调。
row-edit-save

event: DataTableRowEditSaveEvent

void

当行编辑被保存时调用的回调。
row-edit-cancel

event: DataTableRowEditCancelEvent

void

当取消行编辑时调用的回调。
state-restore

event: DataTableStateEvent

void

当有状态表保存状态时调用。
state-save

event: DataTableStateEvent

void

当有状态表恢复状态时调用。

这篇关于PrimeVue DataTable 属性值解析的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1124570

相关文章

Java中Redisson 的原理深度解析

《Java中Redisson的原理深度解析》Redisson是一个高性能的Redis客户端,它通过将Redis数据结构映射为Java对象和分布式对象,实现了在Java应用中方便地使用Redis,本文... 目录前言一、核心设计理念二、核心架构与通信层1. 基于 Netty 的异步非阻塞通信2. 编解码器三、

Java HashMap的底层实现原理深度解析

《JavaHashMap的底层实现原理深度解析》HashMap基于数组+链表+红黑树结构,通过哈希算法和扩容机制优化性能,负载因子与树化阈值平衡效率,是Java开发必备的高效数据结构,本文给大家介绍... 目录一、概述:HashMap的宏观结构二、核心数据结构解析1. 数组(桶数组)2. 链表节点(Node

Java 虚拟线程的创建与使用深度解析

《Java虚拟线程的创建与使用深度解析》虚拟线程是Java19中以预览特性形式引入,Java21起正式发布的轻量级线程,本文给大家介绍Java虚拟线程的创建与使用,感兴趣的朋友一起看看吧... 目录一、虚拟线程简介1.1 什么是虚拟线程?1.2 为什么需要虚拟线程?二、虚拟线程与平台线程对比代码对比示例:三

一文解析C#中的StringSplitOptions枚举

《一文解析C#中的StringSplitOptions枚举》StringSplitOptions是C#中的一个枚举类型,用于控制string.Split()方法分割字符串时的行为,核心作用是处理分割后... 目录C#的StringSplitOptions枚举1.StringSplitOptions枚举的常用

Python函数作用域与闭包举例深度解析

《Python函数作用域与闭包举例深度解析》Python函数的作用域规则和闭包是编程中的关键概念,它们决定了变量的访问和生命周期,:本文主要介绍Python函数作用域与闭包的相关资料,文中通过代码... 目录1. 基础作用域访问示例1:访问全局变量示例2:访问外层函数变量2. 闭包基础示例3:简单闭包示例4

MyBatis延迟加载与多级缓存全解析

《MyBatis延迟加载与多级缓存全解析》文章介绍MyBatis的延迟加载与多级缓存机制,延迟加载按需加载关联数据提升性能,一级缓存会话级默认开启,二级缓存工厂级支持跨会话共享,增删改操作会清空对应缓... 目录MyBATis延迟加载策略一对多示例一对多示例MyBatis框架的缓存一级缓存二级缓存MyBat

前端缓存策略的自解方案全解析

《前端缓存策略的自解方案全解析》缓存从来都是前端的一个痛点,很多前端搞不清楚缓存到底是何物,:本文主要介绍前端缓存的自解方案,文中通过代码介绍的非常详细,需要的朋友可以参考下... 目录一、为什么“清缓存”成了技术圈的梗二、先给缓存“把个脉”:浏览器到底缓存了谁?三、设计思路:把“发版”做成“自愈”四、代码

Java集合之Iterator迭代器实现代码解析

《Java集合之Iterator迭代器实现代码解析》迭代器Iterator是Java集合框架中的一个核心接口,位于java.util包下,它定义了一种标准的元素访问机制,为各种集合类型提供了一种统一的... 目录一、什么是Iterator二、Iterator的核心方法三、基本使用示例四、Iterator的工

vue监听属性watch的用法及使用场景详解

《vue监听属性watch的用法及使用场景详解》watch是vue中常用的监听器,它主要用于侦听数据的变化,在数据发生变化的时候执行一些操作,:本文主要介绍vue监听属性watch的用法及使用场景... 目录1. 监听属性 watch2. 常规用法3. 监听对象和route变化4. 使用场景附Watch 的

Java JDK Validation 注解解析与使用方法验证

《JavaJDKValidation注解解析与使用方法验证》JakartaValidation提供了一种声明式、标准化的方式来验证Java对象,与框架无关,可以方便地集成到各种Java应用中,... 目录核心概念1. 主要注解基本约束注解其他常用注解2. 核心接口使用方法1. 基本使用添加依赖 (Maven