# react-uiplugin-hook-demo

**Repository Path**: kevinleeeee/react-uiplugin-hook-demo

## Basic Information

- **Project Name**: react-uiplugin-hook-demo
- **Description**: 案例：封装UI组件案例

react hook封装一些UI组件，可以通过配置项来更改组件样式或内容

**封装：**

- 按钮
- 复选框
- `checkbox`单选多选全选反选框组件
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2022-02-24
- **Last Updated**: 2022-02-24

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

**案例：封装 UI 组件案例**

`react hook`封装一些 UI 组件，可以通过配置项来更改组件样式或内容

**封装：**

- 按钮
- 复选框
- `checkbox`单选多选全选反选框组件

**案例展示图：**

![image-20220224015811206](https://gitee.com/kevinleeeee/blog-hexo-image-bed/raw/master/img//image-20220224015811206.png)

**目录：**

```
├─src
|  ├─App.jsx - 视图绑定/自定义配置项
|  ├─index.jsx
|  ├─components
|  |     ├─MyCheckboxList - 列表组件/单选/全选/删除逻辑/动态视图渲染
|  |     |       ├─index.jsx
|  |     |       └index.scss
|  |     ├─MyCheckbox - 复选框组件
|  |     |     ├─index.jsx
|  |     |     └index.scss
|  |     ├─MyButton - 按钮组件
|  |     |    ├─index.jsx
|  |     |    └index.scss
├─mock
|  └students.js
```

**总结：**

- 由外向内写组件
- 明确需求再写逻辑

**源码地址：** https://gitee.com/kevinleeeee/react-uiplugin-hook-demo