Vue 3 的基本日期表组件 - vue3-datatable

Vue 3 的基本日期表组件 - vue3-datatable
插件名称 vue3-datatable
发布时间 2021年9月7日
插件作者 JoBinsJP

用 TypeScript 和 Composition API 编写的基本 Vue 3 数据表组件。

安装和下载:

# Yarn
$ yarn add @jobinsjp/vue3-datatable

# NPM
$ npm i @jobinsjp/vue3-datatable --save

特征:

  • 响应式布局。
  • 分页。
  • 条纹行。
  • 数据过滤器。
  • 自定义加载器。
  • 自定义行/列。

基本用法。

1. 将组件添加到模板中。

<data-table :rows="data"/>

2.可用道具。

rows: { type: Array, required: true },
columns: { type: Object, required: false, default: null },
pagination: { type: Object as PropType<PaginationProps>, required: false, default: null },
striped: { type: Boolean, required: false, default: false },
sn: { type: Boolean, required: false, default: false },
filter: { type: Boolean, required: false, default: false },
loading: { type: Boolean, required: false, default: false },
perPageOptions: { type: Array as PropType<Array<string | number>>, required: false, default: () => PER_PAGE_OPTIONS },
query: { type: Object as PropType<QueryProps>, required: false, default: () => ({}) },
topPagination: { type: Boolean, required: false, default: false },
bottomPagination: { type: Boolean, required: false, default: true },