初始化工程
This commit is contained in:
61
README.md
61
README.md
@@ -116,26 +116,6 @@ src/
|
||||
- 💾 **数据持久化** - 自动保存用户输入
|
||||
- 🔄 **状态同步** - 全局状态实时更新
|
||||
|
||||
## 核心功能实现
|
||||
|
||||
### 动态表单配置 ⭐
|
||||
- **JSON驱动** - 通过配置文件定义表单结构
|
||||
- **字段类型丰富** - 支持10+种字段类型(图片上传、文本输入、多选、计数器、滑动条等)
|
||||
- **灵活配置** - 支持验证规则、默认值、选项配置
|
||||
- **自动渲染** - 根据配置自动生成对应的UI组件
|
||||
- **类型安全** - 完整的TypeScript类型定义
|
||||
|
||||
### 支持的字段类型
|
||||
- `image-upload` - 图片上传
|
||||
- `text-input` - 文本输入
|
||||
- `number-input` - 数字输入
|
||||
- `time-display` - 时间显示
|
||||
- `venue-input` - 场地输入(带箭头)
|
||||
- `multi-select` - 多选按钮
|
||||
- `counter` - 计数器(min/max)
|
||||
- `slider` - 滑动条
|
||||
- `radio-group` - 单选按钮组
|
||||
- `checkbox` - 复选框
|
||||
|
||||
### 图片上传
|
||||
- 使用Taro.chooseImage API
|
||||
@@ -156,47 +136,6 @@ src/
|
||||
|
||||
## 如何自定义表单配置
|
||||
|
||||
### 修改表单字段
|
||||
|
||||
编辑 `src/config/formConfig.ts` 文件:
|
||||
|
||||
```typescript
|
||||
// 添加新字段
|
||||
{
|
||||
key: 'newField', // 字段唯一标识
|
||||
type: 'text-input', // 字段类型
|
||||
title: '新字段', // 显示标题
|
||||
required: true, // 是否必填
|
||||
placeholder: '请输入内容', // 占位符
|
||||
defaultValue: '', // 默认值
|
||||
validation: { // 验证规则
|
||||
min: 1,
|
||||
max: 100,
|
||||
message: '请输入1-100字符'
|
||||
}
|
||||
}
|
||||
|
||||
// 修改现有字段
|
||||
{
|
||||
key: 'playStyle',
|
||||
type: 'multi-select',
|
||||
title: '活动玩法',
|
||||
options: [
|
||||
{ label: '新玩法', value: 'new-style' }, // 添加新选项
|
||||
{ label: '单打', value: '单打' },
|
||||
// ... 其他选项
|
||||
]
|
||||
}
|
||||
```
|
||||
|
||||
### 支持的配置选项
|
||||
|
||||
- **基础配置**: `key`, `type`, `title`, `required`, `placeholder`, `hint`
|
||||
- **默认值**: `defaultValue`
|
||||
- **验证规则**: `validation.min`, `validation.max`, `validation.message`
|
||||
- **选项配置**: `options` (用于选择类型字段)
|
||||
- **特殊配置**: `config.maxImages`, `config.minValue`, `config.showArrow` 等
|
||||
|
||||
## 开发者说明
|
||||
|
||||
本项目采用最简单有效、优雅的方式实现,避免代码冗余,遵循以下原则:
|
||||
|
||||
Reference in New Issue
Block a user