# WetProElement

::: tip 基本介绍

`WetProElement` 是基于 `Element-Plus` 而开发的模板组件，提供了更高级别的抽象支持，开箱即用。可以显著地提升制作 CRUD 页面的效率，更加专注于页面。

:::

## 组件总览

>WetProElement 是基于 Element-plus 而开发的模板组件，提供了更高级别的抽象支持，开箱即用。可以显著地提升制作 CRUD 页面的效率，更加专注于页面。

引入方法 `import { 组件 } from '@wetspace/pro-components';`

## 主题

- 全量引入：`import '@wetspace/pro-components/dist/styles/index.css'`
- 按需引入：`import '@wetspace/pro-components/styles/[对应组件的样式文件].scss'` 

## 主体组件

ProLayout 解决布局的问题，提供开箱即用的菜单和面包屑功能
ProTable 表格模板组件，抽象网络请求和表格格式化
ProForm 表单模板组件，预设常见布局和行为
ProCard 提供卡片切分以及栅格布局能力
ProDescriptions 定义列表模板组件，ProTable 的配套组件
ProSkeleton 页面级别的骨架屏

## 与网络请求库配置使用

ProTable 和 ProList 使用了新的数据结构，如果你使用了我们约定的参数使用起来会非常简单

```ts
const msg: {
  data: T[];
  page: number;
  success: boolean;
  total: number;
} = {
  data: [],
  page: 1,
  success: true,
  total: 0,
};
```

## 相关资源

- [element-plus](http://element-plus.org/zh-CN/)
- [quill](https://quilljs.com/docs/quickstart)

## 学习指导

关注b站，[不加糖的奶酪先生](https://space.bilibili.com/433322445?spm_id_from=333.1007.0.0)