npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2025 – Pkg Stats / Ryan Hefner

@yidun/el-super-table

v0.0.5

Published

一个基于 Element Plus 的高级表格组件,支持查询表单、表格配置、分页等功能。

Readme

ElSuperTable

一个基于 Element Plus 的高级表格组件,支持查询表单、表格配置、分页等功能。

Props

| 属性名 | 类型 | 默认值 | 说明 | |--------|------|--------|------| | name | String | '' | 表格名称,用于缓存表格设置 | | autoSearch | Boolean | true | 是否启用自动搜索 | | onRequest | Function | - | 表格数据请求方法,必需 | | refreshDeps | Array | [] | 依赖刷新数组 | | formItems | Array | [] | 查询条件配置 | | formLabelWidth | String | '80px' | 查询项标签宽度 | | columns | Array | [] | 表头配置 | | pagination | Object | {} | 分页配置,支持 pageSize、pageNum | | defaultSort | Object | {} | 默认排序配置 | | debounceWait | Number | 300 | 防抖时间(ms) | | splitLine | Boolean | true | 是否显示区域分割线 |

FormItems 配置

查询条件配置项,每个配置项包含以下属性:

| 属性名 | 类型 | 说明 | |--------|------|------| | type | String | 查询项类型,支持:input、select、datePicker、component | | name | String | 查询项对应的字段名称 | | label | String | 查询项标签 | | hideLabel | Boolean | 是否隐藏标签 | | props | Object | 传递给查询项的属性 | | defaultValue | Any | 默认值 | | formatValueText | Function | 格式化查询项值的文本 | | component | Component | 自定义组件 | | span | Number | 查询项宽度系数 | | visible | Boolean | 是否可见 |

Columns 配置

表格列配置,每个配置项包含以下属性:

| 属性名 | 类型 | 说明 | |--------|------|------| | key | String | 列的唯一标识 | | title | String | 列标题 | | type | String/Function | 列类型,支持:text、link、tag、button、component | | titleTooltip | String/Function | 标题提示信息 | | content | String/Function | 表格内容 | | tooltip | String/Boolean/Function | 内容提示信息 | | component | Component | 自定义组件 | | props | Object/Function | 组件属性 | | copyable | Boolean | 是否可复制 | | ellipsis | Boolean | 是否显示省略号 | | width | String/Number | 列宽度 | | minWidth | String/Number | 最小宽度 | | fixed | Boolean/String | 是否固定列 | | sortable | Boolean/String | 是否可排序 | | resizable | Boolean | 是否可调整宽度 | | align | String | 对齐方式 | | headerAlign | String | 表头对齐方式 |

Events

| 事件名 | 参数 | 说明 | |--------|------|------| | form-item-change | (name: string, value: any) | 表单项值变化时触发 |

Methods

| 方法名 | 参数 | 返回值 | 说明 | |--------|------|--------|------| | getFormValues | - | Object | 获取所有查询条件值 | | getRquestsParams | - | Object | 获取完整的请求参数 | | onSearch | (page?: number) | - | 执行搜索 | | getFormItemWidth | (item: Object) | String | 获取查询项宽度 | | openAdvancedSearchDialog | - | - | 打开高级搜索对话框 | | onAdvancedSearchChange | (filterList: Array) | - | 高级搜索条件变化 | | formatTagText | (filterItem: Object) | String | 格式化标签文本 | | onRemoveFilter | (filterItem: Object) | - | 移除筛选条件 | | onAutoSearch | - | - | 自动搜索 | | getComponentProps | (column: Object, scope: Object) | Object | 获取组件属性 | | getFormItemProps | (formItem: Object) | Object | 获取表单项属性 | | setFormValue | (name: string, value: any) | - | 设置单个查询项的值 | | setFormValues | (values: Object) | - | 批量设置查询项的值 |