This commit is contained in:
张成
2025-11-25 11:23:25 +08:00
parent aa56e55565
commit dcbcbb49f6
7 changed files with 131 additions and 0 deletions

View File

@@ -0,0 +1,131 @@
# 小程序框架文档说明
## 📋 目录
- [项目结构](#项目结构)
- [不可修改目录](#不可修改目录)
- [可修改目录](#可修改目录)
- [使用组件的方式](#使用组件的方式)
---
## 项目结构
```
mini-programs/
├── src/
│ ├── components/ # ⚠️ 不可修改(公共组件)
│ ├── utils/ # ✅ 可修改(工具函数)
│ ├── services/ # ✅ 可修改API 服务)
│ ├── store/ # ✅ 可修改(状态管理)
│ ├── config/ # ✅ 可修改(配置文件)
│ ├── scss/ # ✅ 可修改(样式文件)
│ ├── static/ # ✅ 可修改(静态资源)
│ ├── container/ # ✅ 可修改(容器组件)
│ ├── context/ # ✅ 可修改(上下文)
│ ├── game_pages/ # ✅ 可修改(球局页面)
│ ├── home_pages/ # ✅ 可修改(首页)
│ ├── login_pages/ # ✅ 可修改(登录页面)
│ ├── main_pages/ # ✅ 可修改(主页面)
│ ├── order_pages/ # ✅ 可修改(订单页面)
│ ├── other_pages/ # ✅ 可修改(其他页面)
│ ├── publish_pages/ # ✅ 可修改(发布页面)
│ └── user_pages/ # ✅ 可修改(用户页面)
├── config/ # 构建配置
├── docs/ # 文档
└── types/ # 类型定义
```
---
## 不可修改目录
### ⚠️ `src/components/` - 公共组件目录
**该目录下的所有组件禁止直接修改**,包括:
- 所有组件文件夹(如 `ActivityTypeSwitch/``CommonPopup/` 等)
- `index.ts` - 组件统一导出文件
- `index.types.ts` - 组件类型定义文件
**如需定制功能,请通过以下方式:**
1. **通过 Props 配置**
```tsx
<CommonPopup visible={visible} title="自定义标题" />
```
2. **通过样式覆盖**
```scss
.custom-wrapper {
.nut-popup {
// 自定义样式
}
}
```
3. **创建业务组件封装**
```tsx
import { CommonPopup } from '@/components';
export const CustomPopup = (props) => {
return <CommonPopup {...props} customConfig={...} />;
};
```
---
## 可修改目录
以下目录可以根据业务需求自由修改:
### 业务页面目录
- `src/game_pages/` - 球局相关页面
- `src/home_pages/` - 首页相关页面
- `src/login_pages/` - 登录相关页面
- `src/main_pages/` - 主页面
- `src/order_pages/` - 订单相关页面
- `src/other_pages/` - 其他页面
- `src/publish_pages/` - 发布相关页面
- `src/user_pages/` - 用户相关页面
### 公共资源目录(可修改)
- `src/utils/` - 工具函数
- `src/services/` - API 服务
- `src/store/` - 状态管理
- `src/config/` - 配置文件
- `src/scss/` - 样式文件
- `src/static/` - 静态资源
- `src/container/` - 容器组件
- `src/context/` - 上下文
---
## 使用组件的方式
### 导入组件
```tsx
// 从统一导出文件导入
import { CommonPopup, CommonDialog, ImageUpload } from '@/components';
```
### 常用组件列表
- `CommonPopup` - 通用弹窗
- `CommonDialog` - 通用对话框
- `ImageUpload` - 图片上传
- `FormSwitch` - 表单开关
- `TimeSelector` - 时间选择器
- `Range` - 范围选择
- `Comments` - 评论组件
- `EmptyState` - 空状态
- 更多组件请查看 `src/components/index.ts`
---
## 📝 注意事项
- ❌ **禁止**直接修改 `src/components/` 下的任何文件
- ✅ **允许**修改其他所有目录和文件
- ✅ 如需定制组件功能,请通过 Props、样式覆盖或封装新组件的方式实现