二次封装element-plus的Descriptions,提供灵活的配置项
简体中文 | English
element-plus
Descriptions 的Descriptions Item
属性目前只能写在<template></template>
模版里,这样不是很灵活,如果描述列表的Item
足够多,代码写、看起来很臃肿,于是我开发了这个库,让我们一起探索吧
- 🦾 灵活度高: 使用
tsx
语法编写,保证类型的同时,给开发者提供了更灵活的写法,给使用者提供了更方便的配置 - ⚡ 完全可摇树: 自带 Tree-shaking,只对引入的代码进行打包
- 🫶 代码零侵入: 保持
element-plus
Descriptions 所有属性、插槽的同时,提供更灵活的配置 - ⚓ 代码提交前校验: 使用 husky 对提交代码前进行规则校验,强制规范开发流程,防止开发失误
npm install @pureadmin/descriptions
or
pnpm add @pureadmin/descriptions
import { PureDescriptions } from "@pureadmin/descriptions";
<pure-descriptions :data="data" :columns="columns"></pure-descriptions>
import { createApp } from "vue";
import App from "./App.vue";
import PureDescriptions from "@pureadmin/descriptions";
const app = createApp(App);
app.use(PureDescriptions).mount("#app");
- 如果您在使用
Volar
,那么可以在 tsconfig.json 中配置 compilerOptions.types 来指定全局组件类型(尤其是全局注册时要想获得类型提示就需要加上下面配置)
// tsconfig.json
{
"compilerOptions": {
// ...
"types": ["@pureadmin/descriptions/volar"]
}
}