Browse Source

📝 docs(entity): 更新实体创建文档中的前端调用部分

- 修改API客户端初始化路径为.api.v1['your-entities']格式
- 精简类型提取示例代码,移除详细的CRUD类型定义
- 更新前端调用章节,提供更简洁的类型提取示例
- 删除原有的React Query调用示例,简化文档结构
yourname 5 months ago
parent
commit
b9055744c1
1 changed files with 11 additions and 63 deletions
  1. 11 63
      .roo/rules/11-entity-creation.md

+ 11 - 63
.roo/rules/11-entity-creation.md

@@ -90,7 +90,7 @@
      
      export const yourEntityClient = hc<YourEntityRoutes>('/api/v1', {
        fetch: axiosFetch,
-     }).your-entities;
+     }).api.v1['your-entities'];
      ```
 
 6. **前端调用**
@@ -450,73 +450,21 @@
      ```typescript
      import { hc } from 'hono/client';
      import { YourEntityRoutes } from '@/server/api';
-     import { axiosFetch } from '@/client/utils/fetch';
      
      export const yourEntityClient = hc<YourEntityRoutes>('/api/v1', {
        fetch: axiosFetch,
-     }).your_entities; // 注意: 路由路径中的连字符会转为下划线
-     
-     // 类型提取
-     import type { InferRequestType, InferResponseType } from 'hono/client';
-     
-     // 列表查询
-     export type YourEntityListQuery = InferRequestType<typeof yourEntityClient.$get>['query'];
-     export type YourEntityListResponse = InferResponseType<typeof yourEntityClient.$get, 200>;
-     
-     // 创建实体
-     export type CreateYourEntityRequest = InferRequestType<typeof yourEntityClient.$post>['json'];
-     export type CreateYourEntityResponse = InferResponseType<typeof yourEntityClient.$post, 200>;
-     
-     // 获取单个实体
-     export type GetYourEntityParams = InferRequestType<typeof yourEntityClient[':id']['$get']>['param'];
-     export type GetYourEntityResponse = InferResponseType<typeof yourEntityClient[':id']['$get'], 200>;
-     
-     // 更新实体
-     export type UpdateYourEntityParams = InferRequestType<typeof yourEntityClient[':id']['$put']>['param'];
-     export type UpdateYourEntityRequest = InferRequestType<typeof yourEntityClient[':id']['$put']>['json'];
-     export type UpdateYourEntityResponse = InferResponseType<typeof yourEntityClient[':id']['$put'], 200>;
-     
-     // 删除实体
-     export type DeleteYourEntityParams = InferRequestType<typeof yourEntityClient[':id']['$delete']>['param'];
-     export type DeleteYourEntityResponse = InferResponseType<typeof yourEntityClient[':id']['$delete'], 200>;
+     }).api.v1['your-entities'];
      ```
 
-### 7. **前端调用示例**
-   - 在页面组件中使用客户端API:
-     ```typescript
-     import { yourEntityClient, type YourEntityListResponse } from '@/client/api';
-     import { useQuery, useMutation, useQueryClient } from 'react-query';
-     
-     // 获取列表数据
-     const fetchEntities = async () => {
-       const res = await yourEntityClient.$get({
-         query: { page: 1, pageSize: 10, status: 1 }
-       });
-       if (!res.ok) {
-         const error = await res.json();
-         throw new Error(error.message || '获取数据失败');
-       }
-       return res.json() as Promise<YourEntityListResponse>;
-     };
-     
-     // 使用React Query获取数据
-     export function useEntitiesData() {
-       return useQuery(['entities'], fetchEntities);
-     }
-     
-     // 创建实体
-     export function useCreateEntity() {
-       const queryClient = useQueryClient();
-       return useMutation(
-         (data) => yourEntityClient.$post({ json: data }),
-         {
-           onSuccess: () => {
-             queryClient.invalidateQueries(['entities']);
-           }
-         }
-       );
-     }
-     ```
+### 7. **前端调用**
+   - 在页面组件(如`pages_users.tsx`)中:
+     - 使用`InferResponseType`提取响应类型
+     - 使用`InferRequestType`提取请求类型
+     - 示例:
+       ```typescript
+       type EntityResponse = InferResponseType<typeof entityClient.$get, 200>;
+       type CreateRequest = InferRequestType<typeof entityClient.$post>['json'];
+       ```
 
 ## 注意事项