@zchaim/js-table v2.4.6
English | 简体中文
🤔 Original intention of development
element-plus Table Table-column attribute can only be written in the <template></template> template at present, which is not very flexible. If the table has enough column, the code is written and looks bloated, but element-plus Virtualized Table The configurability is very high. In order to maintain unity, I encapsulated Table twice and used cellRenderer, headerRenderer These two custom renderers, Built-in Pagination component that can be rendered by configuration, of course, there are some additional properties, let's explore together
🚀 Features
🦾 High flexibility: Written using tsx syntax, while ensuring the type, it provides developers with more flexible writing methods and provides users with more convenient configuration
⚡ Fully tree-shaking: Comes with Tree-shaking, only packages the imported code
🫶 Code Zero Intrusion: While keeping all properties, slot, events and methods of element-plus Table, Provides more flexible configuration, It also has built-in Pagination components that can be rendered by configuration
⚓ Verification before code submission: Use husky to verify the rules before submitting code, enforce standard development process and prevent development mistakes
📦 Install
npm install @pureadmin/table
or
pnpm add @pureadmin/table🕸️ CDN
<script src="//unpkg.com/@pureadmin/table"></script>
or
<script src="//cdn.jsdelivr.net/npm/@pureadmin/table"></script>🦄 Usage
Partial registration (single file)
import { PureTable } from "@pureadmin/table";
<pure-table :data="dataList" :columns="columns" :pagination="pagination"></pure-table>Global registration (main.ts)
import { createApp } from "vue";
import App from "./App.vue";
import Table from "@pureadmin/table";
const app = createApp(App);
app.use(Table).mount("#app");Click to view the usage of on-demand, global and Html file import
Volar support
If you are using Volar, you can configure compilerOptions.types in tsconfig.json to specify the global component type (especially if you want to get type hints when registering globally, you need to add the following configuration)
// tsconfig.json
{
"compilerOptions": {
//...
"types": ["@pureadmin/table/volar"]
}
}