shop-wx/doc/code/shop/移植说明.md

3.2 KiB
Raw Permalink Blame History

Shop API 移植说明

移植概述

doc/code/shop 目录下的 API 移植到 src/api/shop 目录下,并适配本项目的 HTTP 请求方式。

目录结构

移植前 (doc/code/shop/)

doc/code/shop/
├── type.ts       # 类型定义
└── index.ts      # API 函数

移植后 (src/api/shop/)

src/api/shop/
├── types.ts      # 类型定义(从 type.ts 移植)
├── index.ts      # API 函数(适配后)
└── README.md     # 使用说明文档

关键变更对比

1. 导入语句变更

移植前:

import { request } from "@/http/axios"
import { GetBalanceResponse, ... } from './type'

移植后:

import { http } from "@/http/http";
import type { ApiResult } from '@/api';
import type {
  GetBalanceResponse,
  ...
} from './types';
import { GetOpenIdRequestParams } from './types';

2. API 函数变更

移植前:

export function getShopGoodsListApi(corpid: string, belongType: number) {
  return request<ApiResponseData<SearchGoodsDO[]>>({
    url: "shop/goods/list",
    method: "get",
    params: { corpid, belongType }
  });
}

移植后:

export async function getShopGoodsListApi(corpid: string, belongType: number) {
  const res: any = await http.get<ApiResult<SearchGoodsDO[]>>("shop/goods/list", { corpid, belongType });
  if (res.data.state === 'ok') {
    return res.data.data;
  }
  return Promise.reject(new Error(res.data.message));
}

3. 主要变更点

变更项 移植前 移植后
HTTP 请求库 @/http/axios @/http/http
请求方法 request({ url, method, params/data }) http.get() / http.post()
泛型类型 ApiResponseData<T> ApiResult<T>
函数声明 function async function
返回处理 直接返回 Promise 增加状态判断和错误处理
类型导入 命名导入 类型专用导入 (type 关键字)

移植的 API 函数列表

已完成移植的 API

  1. getShopGoodsListApi - 获取商品列表
  2. getShopGoodsApi - 获取商品详情
  3. submitOrderApi - 提交订单
  4. getOpenIdApi - 获取微信 openid
  5. qyLogin - 企业微信登录
  6. fakeQyLoginApi - 模拟企业微信登录
  7. getOrdersByOpenIdApi - 根据 openid 获取订单
  8. getOrdersByQyUserIdApi - 根据企业微信用户ID获取订单
  9. openCabinetApi - 打开储物柜
  10. getBalanceApi - 获取用户余额openid
  11. getBalanceByQyUserid - 获取用户余额userid
  12. getShopListApi - 获取商店列表

使用方式

所有 API 函数现在都是 async 函数,返回值为实际数据(成功后)或 Promise.reject(失败后)。

调用示例:

import { getShopGoodsListApi } from '@/api/shop';

// 在 async 函数中调用
const goods = await getShopGoodsListApi('corpid', 0);

注意事项

  1. 所有 API 函数现在返回实际数据,而不是包装后的响应对象
  2. 需要自行处理错误(使用 try-catch 或 .catch()
  3. 类型定义文件 types.ts 包含了所有必要的类型
  4. 如需了解更多用法,请参考 README.md