# hs-element-plus

**Repository Path**: iamshen/hs-element-plus

## Basic Information

- **Project Name**: hs-element-plus
- **Description**: hs-element-plus 组件库是基于 Vue 3 和 Element Plus 的组件库，旨在简化 Element Plus 组件的使用并提供额外的功能增强。
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-06-28
- **Last Updated**: 2024-07-30

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# hs-element-plus 组件库

hs-element-plus 组件库是基于 Vue 3 和 Element Plus 的组件库，旨在简化 Element Plus 组件的使用并提供额外的功能增强。

## 安装

使用 `pnpm` 进行安装：

```bash
pnpm install hs-element-plus
```

## 使用方法

### 引入组件

从 `hs-element-plus` 中导入需要的组件，并在你的 Vue 3 应用程序中使用它们。

```typescript
// main.ts
import { createApp } from 'vue'
import HsElPlus from 'hs-element-plus'
import App from './App.vue'
import 'element-plus/dist/index.css'

const app = createApp(App)
app.use(HsElPlus)
app.mount('#app')
```

### 示例：使用 ElPlusTable 组件

在你的 Vue 组件中：

```vue
<script setup lang="ts">
import { reactive, ref } from 'vue'
import { ElPlusTable } from 'hs-element-plus'
import type { PageRequest, TableColumnProps } from 'hs-element-plus/types'

const tableRef = ref(null)
const pageRequestModel = reactive({})
const columns: TableColumnProps[] = []

function pageRequestFn(pageRequest: PageRequest) {
  // 实现你的分页请求逻辑
}

function handleCommand(command: string, item: any) {
  // 处理表格操作命令
}
</script>

<template>
  <ElPlusTable
    ref="tableRef"
    v-model:pageRequestModel="pageRequestModel"
    :page-request-fn="pageRequestFn"
    :columns="columns"
    @handle-command="handleCommand"
  />
</template>
```

## 文档

详细的组件和属性文档，请参阅  [ElPlus Components Documentation](https://your-docs-url).

## 许可证

本项目采用 MIT 许可证 - 查看 LICENSE 文件获取更多信息