Skip to content

Commit 25fade3

Browse files
committed
fix readme
1 parent b18fcc2 commit 25fade3

File tree

1 file changed

+59
-56
lines changed

1 file changed

+59
-56
lines changed

README.md

Lines changed: 59 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -1,44 +1,71 @@
11
# Form PC
22

3-
A modern UI Framework built with React and TypeScript, providing powerful form components and tools for building complex web applications.
3+
基于PC的Form表单渲染引擎
44

5-
## Features
6-
7-
- 🚀 Built with React 18 and TypeScript
8-
- 📦 Modular and tree-shakeable
9-
- 🎨 Beautiful and customizable UI components
10-
- 📝 Rich form components and validation
11-
- 🔧 Easy to use and extend
12-
- 🎯 High performance and optimized bundle size
13-
14-
## Installation
15-
16-
```bash
17-
# Using npm
5+
## 安装
6+
```
187
npm install @codingapi/form-pc
19-
20-
# Using yarn
8+
# 或者使用yarn
219
yarn add @codingapi/form-pc
22-
23-
# Using pnpm
24-
pnpm add @codingapi/form-pc
2510
```
2611

27-
## Quick Start
28-
29-
```tsx
30-
import { Form } from '@codingapi/form-pc';
12+
## 使用
3113

32-
function App() {
33-
return (
34-
<Form>
35-
{/* Your form components here */}
36-
</Form>
37-
);
14+
#### Form表单的渲染
15+
```
16+
import React from "react";
17+
import {Form} from "@codingapi/form-pc";
18+
import {FormField} from "@codingapi/ui-framework";
19+
20+
const Test = () => {
21+
22+
const fields = [
23+
{
24+
type: 'input',
25+
props: {
26+
required: true,
27+
name: ['user', 'name'],
28+
label: '姓名',
29+
placeholder: '请输入姓名',
30+
validateFunction: async (content) => {
31+
const value = content.value;
32+
if (value) {
33+
return []
34+
}
35+
return ['姓名不能为空']
36+
}
37+
}
38+
}] as FormField[]
39+
40+
return (
41+
<>
42+
<Form
43+
layout={"vertical"}
44+
onFinish={async (values) => {
45+
console.log(values);
46+
}}
47+
loadFields={async () => {
48+
return fields;
49+
}}
50+
>
51+
</Form>
52+
</>
53+
)
3854
}
55+
56+
export default Test;
3957
```
58+
更多示例请查看:https://github.com/codingapi/form-pc/tree/main/playground
59+
4060

41-
## Development
61+
## 主要特征
62+
63+
- 支持对常用的Form表单的组件渲染
64+
- 即支持Meta数据渲染,也支持组件的渲染
65+
- 支持对form表单的控制能力
66+
- 支持表单字段的onChange、validate能力
67+
68+
## 开发
4269

4370
```bash
4471
# Install dependencies
@@ -53,32 +80,8 @@ yarn build
5380
# Run tests
5481
yarn test
5582
```
83+
## 许可
5684

57-
## Project Structure
58-
59-
```
60-
form-pc/
61-
├── src/ # Source code
62-
├── dist/ # Build output
63-
│ ├── cjs/ # CommonJS build
64-
│ └── esm/ # ES Modules build
65-
├── rollup.config.js # Rollup configuration
66-
└── package.json # Project metadata
67-
```
68-
69-
## Browser Support
70-
71-
- Chrome >= 60
72-
- Firefox >= 60
73-
- Safari >= 12
74-
- Edge >= 79
75-
76-
## Contributing
77-
78-
We welcome contributions! Please see our [Contributing Guide](CONTRIBUTING.md) for details.
79-
80-
## License
81-
82-
Apache-2.0 © [CodingAPI](https://github.com/codingapi)
85+
Apache-2.0 © [CodingAPI](https://github.com/codingapi/form-pc/blob/main/LICENSE)
8386

8487

0 commit comments

Comments
 (0)